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Two brains are better than one. 


Announcing the new dual-processor Power Mac G4. With its built-in 
Velocity Engine, a single G4 processor can reach supercomputer speeds of over 
three billion calculations per second (three gigaflops) — outperforming even the 
fastest Pentium III.” Now, with a pair of G4 processors 
combining their power to attain speeds of over seven 


gigaflops, the new Power Mac G4 can cut through a 
common suite of Photoshop tests twice as fast as a 1GHz Pentium III-based PC. 
A level of performance that will definitely double your pleasure and double your 
fun. To find out how the dual-processor Power Mac G4 can accelerate the work 
you do every day, visit us at www.apple.com/uk or call 0800-783-4846. 


4 


Think different. 


*In CPU and Photoshop tests. ©2000 Apple Computer, Inc. All rights reserved. Apple and the Apple logo are trademarks of Apple Computer, Inc., registered in the US 
and other countries, Power Mac, Think different and Velocity Engine are trademarks of Apple Computer, Inc. Pentium is a registered trademark of Intel Corp. 


04 
arts 


08 


This month's CD includes 
Illustrator 9 and Fontographer 


How Nathan Jurevicius plundered 
illustrator 9's toolbox to create our 
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displays 4, sony 


Heads will turn. Whichever way you look at it, the N50PS really has something. 
Notice the remarkable 12 mm thin profile of the carbon-black bezel with the 
polished aluminium case. Versatile desk or wall mounting option, with portrait or 
landscape format. Cast your eyes over it and one thing becomes obvious — this is 
revolutionary design. The future of displays. You’re looking at it. 


www.sony-cp.com 
Sony is a trademark of Sony Corporation, Japan 
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Create our 
cover image 


A self-confessed fan of large, flat-coloured 
artwork, Nathan Jurevicius explains how to use 
IIlustrator's vector manipulation toolbox and 
Web optimisation features 


nthe transition from natural 
media to digital imagery, 
many artists aim at creating 
graphics that reproduce the 
characteristics of traditional paint. 

In this respect, Painter's toolbox 
contains some very artist-friendly 
features. The Pen tool, for example, 
can help you create the sort of clean, 
flat images usually produced using 
watered-down acrylic paint. The program 
also supports real transparency, drop 
shadows and feathering of objects and 
saves images as vectors in their native 
format. If previous versions of /llustrator 
have lacked Fainter’s vector effects, then 


Illustrator 9 aims to change all that. Unlike 
Painter, Illustrator 9 is industry standard 
and also offers a vector manipulation 
toolbox into the bargain. 

Nathan Jurevicius, this month’s cover 
artist, is now a confirmed fan: “It’s a 
program that I’ve quickly grown to love,” 
he says. “The ability to optimise work for 
the Web is also a great new feature that 
will be an enormous benefit in helping me 
create Web interfaces.” 
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Part 1: Setting up the document 


Settling on a final image can be a lengthy process! Several dummy ideas are 
tried and tested before a rough graphic is placed into ///ustrator for design 


Rough stuff 


For Nathan, roughs are important 
in the creation of a great-looking 
final illustration: "If | feel happy 
with the rough | generally know 
that the outcome will be good. 
Clean roughs are also useful to 
avoid confusion with a client - the 
better the intial sketching 
process the quicker the idea is 


accepted and understood.” 


Nathan's cover brief was fairly open: a bold 

image with a real vector feel and maybe a 
subtle Christmas reference. After a few very quick 
concept sketches, some stretchy looking people 
emerged. The design even went off on “an Indian 
guru tangent" at one point. 


4 | The two roughs were so similar that it was 
easy to combine them. With both cover ideas 


scanned into Photoshop, very rough selections were 


made with the Lasso tool in order to cut and paste 
the images until they formed a pleasing layout. It's 


also possible to do a print out of the rough and draw 


over it for tracing in ///ustrator. 


If you're following this tutorial in order to 

create a similar illustration then you'll notice a 
dialog box like this one prompting you to choose 
various colour modes when //Iustrator 9 starts up. 
For a job like this one, choose CMYK as it needs to 
be set up for print. Also put in the dimension details 
(you can specify most measurement types). 
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iinstratar 9, Freehand * 
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The roughs were narrowed down to two ideas: 


the first consisted of a happy-looking guy 
sitting on a chair above his apartment, lighting a 
pipe with an unusually large flame. The rough was 
drawn in pencil, scanned into Photoshop and then 
dummy text and logo were superimposed to create 
the composition. 


G The final rough ended up being used in a 
horizontal layout. A section of the artwork has 
been used for the cover while the artwork in its 
entirety is shown in this tutorial. 


8 | Before tracing the image, Nathan set up a 
basic palette of CMYK colours from previous 
illustrations, then placed the colours as a TIFF file 
from Photoshop into I/lustrator. Using the Shift key 
and Eyedropper, he then created the colours in the 
Swatch palette, and saved the file. 
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The second idea also had flames as a back 

drop, but this time the main character was a 
large totem pole surrounded by buildings and 
Christmas gifts. Again the dummy text and logo 
were placed over the rough in Photoshop for a 
mock-up composition. 


G At this stage the rough was saved as a TIFF to 
be placed into ///ustrator. 


© At this stage the rough is finally placed into 
Illustrator. The latest version has a feature that 
enables you to fade an image for tracing. Open up 
the Layer options info box and check the Dim 
Images To tab and set the Dim to 30 per cent. This 
setting gives you a result that's dark enough to see 
but light enough to be unobtrusive. Lock the rough. 


Part 2: Creating the main character and totem pole 


Grouping your design elements with the Selection tool makes it easier to 
move them about. Duplicating and resizing images can also speed things up 


Inspiration 

Every artist has a failsafe quote 
that gets them going when the 
well of inspiration dries up... 
(poetic, eh?) Here's Nathan's: 
“Don't waste time waitng for 
inspiration. Begin, and inspiration 


will find you.” 


o Transparency can be used again to create a 
nice atmosphere around the little window in 


#s Work on the main character until it becomes a 


range of purple and orange shades. This sets the building below the man. Give the outside 
gh Apply a transparent colour to the side of the the feel for the rest of the cover as the character's lamplight an Opacity of 52 per cent so the 
face to create subtle shadows. The pink onthe _ tone is reflected throughout the illustration. Once Christmas tree behind the window ledge is still 
nose and brown in the hair and beard were all made — the man is completed, drag the Selection tool over visible. The shadows around the ledge are also low 
up of transparent colours. the image and group it. Opacity levels of black. 


4 | Once the building is completed, add a few o After creating the main character and building, 

embellishments, in particular a very light begin work on the totem pole image. Small 6 | After finishing the head, randomly add a few 

flame-like glow behind the stairs and top corner of objects like the lines under the eyes and the curls on small triangular chips. These eventually merge 
the apartment. Create a dark shadow between the the beard are grouped and given the same into the purple coloured shape that appears around 
chair and black lamplight. transparency settings. the figure. 
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Work on the image until it resembles a totem - 

pole version of the main sitting character. Add . 7 o To create the pine trees behind the pole, 
transparent shadows between the legs and the base G Group the totem pole using the Selection tool, duplicate the same illustration and then resize 
of the pole. Create a pale yellow flame reflection (like all the major parts of the illustration), it. Group, duplicate and adjust the red gifts using 
and some more triangular chips. ready to be moved around at a later date. the Free Distort filter. 
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Part 3: Backgrounds and shadows 


At this stage, we'll use Opacity to create various light effects and flames for extra 
depth. Subtle transparent lines give a feeling of movement 


Free rein 


More advice for the creative 
process: “If an art director or an 
editor asks you to come up with 
anything for a cover illustration, 
don't be afraid to go as strange 
and twisted as you want... all they 
can Say is to tone it down a bit 
(which is probably how you would 


have done the job anyway!).” 
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ei The buildings are made up of tones of purple 
and brown to reflect the colours of the larger 

main building. Group the woman's face, then copy @ Transparency has been used extensively here to create a warm atmosphere. Use very low settings of 

and paste it and slightly adjust it to create a man's Opacity to make the light beams radiate out of the windows. Other details such as the circular shadows 

face, using the Direct Selection tool. beneath the gifts, the stones on the grass and the flame-like reflections on the walls can be added later. 


4 | To help create the feeling of depth and 
movement, duplicate the flames and paste 


8] Use the Rectangle tool to create the red them behind the originals. Adjust the Opacity Slider 5 | Use the Knife tool to slice sections of the 
background and stretch it across the entire to a fairly low percentage. If you want to draw the background flames. Individually move and 
image. Draw flames with the Pen tool and carefully original flames back a bit, then adjust their Opacity scale these behind the main seated character to 


adjust using the Direct Selection pointer. by about five per cent. provide a greater depth to the cover. 


G To trace the birds above the man's head, knock 
back the Opacity of the red to about 10 per G With the red back to its original level, quickly 8 | Finally, small details were added to the main 


cent. Group the first bird, then copy and paste to create the dark clouds again with the Pen tool. character and totem pole. Subtle transparent 
create the second image. Use the Direct Selection Copy and paste these, and give them different white lines around the back and arms were intended 
tool to slightly adjust the wings and body. transparency settings. to give the feeling of slight movement. 


| BPreserve itustrator Editing Capabilities 
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| Embed au Fonts 
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Ge Nathan saved the image as an //Iustrator 9 file 
and as an Adobe PDF. This makes it easy to 
bring it into Photoshop to check the colours. 


Separation setup, 
Setup. 


4 | If you're doing Web design work, you might 
also find it useful to export the image using 
the Save for Web function in the File menu. 


Once a setting has been chosen, you are given 

the option of clicking a button at the bottom 
of the display area. This enables you to see how the 
illustration appears in a browser. The preview also 
displays all the information about the image as well 
as the HTML code. 


Part 4: Saving and testing the file 


Saving the image as a PDF enables you make further colour alterations in 
Photoshop. You might also want to export the image for Web design work 


 Rasterize Generic POF Format 
Image Size: 39.2 
warn: [s2 —_—](m_—_—9) 
woign: [25] [am—8) 
nesottion: [500] 
woe: 


ZAnti-aiased [A Constrain Proportions 
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gy When you open the PDF file in Photoshop, a 
dialog box prompts you to add the resolution 
you'd like the final image to be rasterized at. To see 
it at typical print quality, choose 300dpi. 


Once the Save for Web function is activated, 

an interface similar to the one in ImageReady 
and Fireworks pops up. To view the best file size 
versus quality variations, it's possible to display four 
different versions of the same image. 


Save the illustration as a GIF. You also have the 
option to save the HTML file with the image 
but you may prefer not to use this function. 


gi Open the Navigator in Photoshop and adjust 
the slider to 100 per cent so that the image 
looks very crisp and the colours very nearly resemble 
those in //lustrator. You may notice that the purple 
seems to contain slightly less red and the pinky 
tones around the face are just a tiny bit brighter. 


6 | The information to the right of the display has 
an excellent range of buttons for optimisation. 
In this case, a GIF is probably the best setting for the 
image (due to its flat appearance) and a colours 
number of 128. You could also opt for colour 
transparency and the ability to interlace the image. 


Open up Dreamweaver and centre the 
9 illustration onto a blank page with a red 
background. You can go to www.antbyte.com.au/ 
cover to see how the final image looks opened in a 
Web browser. EEE) 
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1. First published in CRM 
magazine, the graphic illustrates ay 
call management software. 


Campbell 


Musician turned artist Campbell Laird produces distinctive abstracts 
using a mixture of improvisation, instinct and Illustrator: “Vector 


¥ 


art is line, shape and colour - th 


ampbell Laird has a list of clients that reads 
like a who's who of US media. But in spite of, 
or perhaps because of, the portfolio of 
household names such as the New York Times, 
Newiaiel and American Express beating a path to his 
door, he's still uncompromising about his style, treating 
commercial success almost as serendipity: “I’m definitely 
in the commercial spotlight, and it’s schizophrenic 
because | don’t necessarily want to be commercial,” he 
says. “I don't have any personal work - everything | do is 
for consumption. | feel that everything | do has value so | 
turn down a lot of work where | don't feel I’m going to be 
able to do exactly what | want,” he adds. 

It’s a lesson he learnt on the road during his time as 
a travelling musician, and he cites one of his heroes, 
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Miles Davis, as the perfect example of dedication to 
art untramelled by commercial success. Campbell 
recalls finally seeing one of Davis's concerts towards 
the end of his career: “We arrived at half-time and | 
heard this amazing trumpet, being softly played with a 
mute,” he says. “The house lights were on at the Lincoln 
Centre, and | realised this solitary figure was Miles 
Davis. He was fifty years old, he didn't have anything to 
prove, but he played through the whole interval,” 
Campbell adds. 

Music is a constant background to his work, literally 
and figuratively, and Campbell describes his 
illustration as the product of a crossbreed of artistic 
influences as eclectic as any record collection. 
Aboriginal bark paintings, the line drawings of 


Gottlieb, Miro and the surrealists, English fabric 
designer Lucienne Day and the compositions of 
Kandinsky all inform his style, and he is currently 
moving towards an approach employing fewer colours, 
in pursuit of a Miro-like simplicity that he believes 
takes a lifetime to achieve. 

Entirely self-taught, he uses /llustrator 8 running on 
a G3 Mac with 256MB of RAM, alongside a Umax 
scanner and occasionally a Wacom Intuos graphics 
tablet, for his work. He cites the speed of the software 
as an ideal property for his instinctive working 
methods: “I try not to spend a lot of time on stuff. 
Computers enable you to refine things for years, and an 
image is essentially never finished,” he explains. “I just 
get bored very quickly. | know lots of fine art illustrators 
use oils and acrylic, but | realise the process it goes 
through. If that was the only option, | never would have 
been an illustrator,” he says. 


Curvy figures get things started 


Most of his work is used in the context of illustrating 
computer-related concepts, and requires the use of a 
variety of curved, serpentine figures. By concentrating 
on these first, he is inspired to develop and elaborate 
upon the concept provided by the brief but still 
maintains an almost suspicious distance from the 
details and literal interpretation: “| have outlines of 
figures that | like, and I'll start drawing on the computer 


2. A cyber cocktail party. 


3. Believe it or not, this graphic 
pictures the impact of Web 
software piracy on small 
computing businesses. 
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4. Published in Forbes magazine, 
this graphic accompanied an 
article by Bill Gates about the 
all-consuming nature of the Web. 
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and get a figure that feels interesting for some reason, 
any reason,” he says. He keeps libraries of line 
drawings for this crucial initial stage, and Campbell 
often uses an element of a previous image as the 
starting point for the next, but still maintains that, for 
him, each image is about avoiding duplication: “You've 
always got to move on and change. Even if | tried to use 
the exact same figure in an image, at some point I'd 
come back and alter it. It’s like the same chord ina 
different progression — what comes after will always 
change it,” he says. 


Filters stymie individuality 


After deciding on a figure, Campbell separates out the 
stages of design in quite an orderly fashion. 
Surprisingly for an artist whose use of colour is so 
eye-catching, he works in black and white, with two 
greys to add foreground and background depth. 
Working to a set size, Campbell concentrates on the 
composition of the image, masking the main shape 
before aligning the other elements: “Once I’m getting 
stuff together | draw around the shape and draw all the 
things | may be including on the one screen, inthe one 
Illustrator file,” he elaborates. “Then | push them into 
the mask and mask all those individual shapes. | might 
put lines in them or use the Hatch effect, or leave them 
empty, but sometimes stuff does need some form of 
textural quality,” he adds. Masking is used to change 
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flat colour in a subtle way, and this Campbell prefers 
this to patterns or gradients, unless he can find an 
unusual way to use them. 

Campbell's use of filters is kept to a bare minimum, 
and when he does resort to them, it appears to be only 
grudgingly. He uses the Pathfinder filter a lot to divide 
images, for example, but always recolours them by 
hand. Part of the reason for his aversion to filters is the 
way he feels it discourages individuality: “I went 
through a stage where | decided that on every job | was 
going to use Vector Effects to warp a figure or do 
something to it,” he recalls. “It was kind of interesting 
for two jobs then everything started looking phoney, 
like I'd used a filter,” he says. 

Recently, Campbell has been approached to 
produce giant wall-mounted designs, and foresees that 
he'll be dabbling with more traditional artistic methods 
in the future. But for now, /llustrator’s simplicity and the 
lure of vector art's potential will continue to occupy him. 
He's largely unimpressed with the tendency for 
over-elaboration in Photoshop, explaining that attempts 
to be spectacular and other-worldly just leave him cold. 
“It's hard to breathe in that world,” he says. “Vectors give 
you the austere and sublime quality of a large flat colour 
field, crisp lines and sharp accurate shapes. What more 
could a youngish man ask for?” he concludes. EEIS 


For more info check out {w] www:theispotcom/ portfolio 
oF contact [t] 001 212 219 3767 [e] EClaird@ aol.com 


Because intuition and speed play such a major role in 
Campbell's design process, he uses /llustrator 8 with 
QuicKeys to assign commands to the function keys, 
but he really wants complete control: “I'm getting 
increasingly bored by generic software with the same 
filters and nic-nacs that every man, woman, designer, 
illustrator and his or her dog will use — where’s the 
originality of ideas?” he asks. Piling on new features is 
not the answer, he reasons, as it results in slower 
performance, generalisation, bugs and the desperate 
inclusion of largely irrelevant, or even worse, retro 
effects such as Gaussian Blur drop shadow (which for 
some reason seems to be a particular béte noir). The 
logical answer, for Campbell, lies with customisation: 
“I'd really like to design and make my own program. It 
would be linear and allow me to make interesting 
patterns and shapes in a method that wasn't for 
anybody else,” he says. “I'd like to see software where 
any illustrator would be able to go in and manipulate 


the program in a way that was right for them.” 
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1.A graphic for Converge magazine to 
illustrate business on the Web. 


2. Stopping Net clutter. 
3. Everyone’s on the Web. 


4. On the subject of broadband 
networks, published in Context. 


5. Depicting wireless technology, this 
graphic was for Converge magazine. 


6. Published by Y ahoo Internet Life to 
depict Napster music distribution. 


ILlustration Special 


arts 


Illustration Special 
arts 


{Freehand 


yMoo'aUT]UOYN seWe (UONESIUEBIO) 89ZB EER OZO *euoydeye] UosprAeg sUUYO :uoERSM}| 


hw Goreldraw Coreldraw coreldraw Coreidral 


Interface awareness 


We guide you through the interfaces and keyboard 
shortcuts of the world’s leading vector applications... 


inding your way around any application To give you a helping hand, we've compiled the 
th can be a daunting task, especially with definitive guide to the shortcuts and interfaces of 
i i] the breadth and depth of features that the world’s leading vector applications - 

im modern professional software offers. Illustrator 9, FreeHand 9 and CorelDRAW 10. 
But, as you gradually get the hang of where When following this guide, PC users 
everything is, what it does, the time-saving should generally press the Alt key wherever the 
keyboard shortcuts, the software is well and truly Option key is mentioned and the Control key 
at your creative disposal. instead of Command. 
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Essential tools 


7 Selection tool - [V] 


fied Rotate - [R] 


The menus 


[llustrators in-depth menus 
hold the key to vector success 


File menu 

Illustrator 9's File menu is a standard 
File menu. From here, you can Open, 
Save and Export files. In addition, you 
can set up and print your documents. 
However, a new Photoshop-esque Save 
for Web dialog enables you to preview 
and compress your artwork. 


Edit menu 


You shouldn't really need to use the Edit 
menu that much because all the basic 
operations such as Copy, Paste and so 
on, are based on the shortcuts. But, if 
you don't know them, the shortcuts are 
next to the relevant operation. However, 
there are a few handy settings in the 
Edit menu - for example, you can 
customise keyboard shortcuts, define 
Colour Settings and edit Preferences. 


Object menu 


The Object menu is central to anyone 
serious about /llustrator, enabling you 
to Transform, Group and manage your 
artwork. Expand is a useful and often 
used command, enabling you to convert 
Fills and Strokes into separate objects. 
Submenus include Path - containing all 
the options you'll need to Join, Slice 
and Simplify paths. 


Type menu 


One of /llustrator’s strongest points is 
its superb ability to handle type. All the 


Thanks to keyboard shortcuts, most of the tools in /[lustrator 9’s vast Tool palette can be accessed in an instant, 
saving you valuable time and increasing productivity... 


Direct Select Lasso - [Q] 


fe] Gradient - [G] 


options for selecting Font, Size as well 
as more advanced DTP-style Paragraph 
and Character settings. This menu is 
handy, but more important adjustments 
can be found in the super-accurate 
keyboard shortcuts. 


Filter menu 


As well as some vector-based 

filters unique to /llustrator, the 

majority of filters in the Filter menu are 
raster-based. In other words, they can 
only be applied to bitmap images or 
artwork that’s been rasterized (Object> 
Rasterize). Virtually any Photoshop- 
compatible third-party filter will be 
found at the bottom of the menu. 


Effect menu 


All the effects in the Effects menu can 
be applied to vector artwork, altering 
the appearance but not changing the 
underlying object. For example, apply a 
Gaussian Blur filter to a black Ellipse, 
and you can scale and move the artwork 
with the effect remaining intact. 


View menu 


The View menu enables you to Zoom in 
and out of artwork, preview it in 
different modes, and show and hide 
various helpers, such as rulers, guides 
and the artboard. 


Window menu 


The Window menu lets you hide and 
display various palettes, Swatch 
palettes and libraries. For more on 
keyboard shortcuts that enable you to 
do this much more quickly, see the 
Palettes section on page 23. 


mode/Full screen with menu 
bar/Full screen) - [F] 


RI vaso- iP Al 


Reflect - [0] 


TBH 


CREars 
Pen-[P] Add-anchor point - [+] 
Delete-anchor point - [-] 


Convert-anchor point - Shift and 
[C] 


OlObs16y 


Ellipse -[L] 


Blend - [W] 


Type tool - [T] 


Scissors - [C] 


Holding down Option and 


Gradient Mesh - [U] 


Rectangle - [M] 


ce -[Z] 


clicking on a tool with an arrow 


in the corner enables you 


Va Eyedropper - [I] 


Paint Bucket - [K] 


ra Ra Pencil - [N] 


Es 4 
Swap fill and stroke - 
SalI shift and px] 


to cycle through each tool in 
that category. 


ed Scale - [S] 


wv (3) Ba Hand tool - [H] Free transform - [E] 


Gradient - [>] 
Colour - [<] 


G,,...1 stroke - [X] 


Hit Caps Lock to change the 
pointer to an accurate cross-hair 
for certain tools such as the Pen 
and Paintbrush. 


Paintbrush - [B] 


[RL R Direct Selection 


tool - [A] 
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Column Graph - [J] 


Elim) Ly Toggle screen 


modes (Standard screen 


The palettes 


These are the key to quickly 
adjusting objects and settings 


Appearance 

This helps you work more easily with 
Appearance attributes, displaying Fill 
lists and attributes, Stroke lists, Object 
Opacity and Effects. The upper part of 
the palette shows the attributes of the 
selected artwork. The five icons at the 
bottom of the palette represent, (from 
left to right): toggle this on to make sure 
new artwork maintains appearance: 
clears appearance (no Fill, no Stroke): 
reduces to basic appearance: 
duplicates the selected item: delete the 
selected attribute. To show/hide this 
palette, tap Shift and F6. 


Information 


The Info palette provides information on 
the selected tool and can give you the 
precise co-ordinates of your artwork. 
Toggle this palette on and off with F8. 


Navigator 


The Navigator palette enables you to 
find your way around complex artwork. 


Colour 


Clicking on the arrow on the left brings 
up several Colour palettes including 

Web Safe, RGB, CMYK and Grayscale. 
To hide/show the Colour palette hit F8. 


Attributes 


Use the Attributes palette to specify 
Overprint options and various 


Path Editing tools 


For optimum creativity and productivity, it’s essential to be 
able to change quickly between /llustrator’s path creation 


and editing tools... 


Swap between Pen tool and Convert Anchor 


Point tool (when Pen tool is selected) - 
Option 

Swap between Add Anchor Point tool and 
Subtract Anchor Point tool - Option 

Edit existing path - Pencil tool and drag 
over selected path 


Web-related settings. Hit F11 to toggle 
the palette on and off. 


Transparency 


The brand new Transparency palette 
enables you to apply transparency to 
any object - the objects remaining 
fully-editable at all times. You can 
specify Blending modes and, in 
addition, the palette provides options 
for complex Opacity masks and Layer 
Clipping masks. Tap Shift and F10 to 
show/hide the palette. 


Stroke 


This palette simply enables you to 
change the stroke width. Hit F10 to 
show/hide the palette. 


Gradient 


Double-click below the colour band to 
create a new gradient square. Now 
select a colour from the Colour palette. 


Viewing and moving objects 


Shift easily between some of /llustrator’s core features 


Viewing 

Fit image to screen - Command and 0 
100 per cent magnification - Double-click 
Zoom tool 

Actual Size - Command and 1 

Zoom In/Out - Command and +/- 
(plus/minus) 

Adjust the position of the Zoom marquee - 
click and drag Zoom marquee and 

tap Spacebar 


Selecting and moving 

Add to or subtract from a selection - 
Selection tool and Shift 

Add to a Lasso selection - Lasso tool and 
Shift and drag 

Subtract from Lasso selection - Lasso tool 


and Option and drag 

Move selection in user-defined increments 
(Edit>Preferences) - Left, Right, Up and 
Down arrow keys 

Move selection in user-defined increments 
x10 - Shift and Left, Right, Up and Down 
arrow keys 

Send selected object to back - Shift and 
Command and ] 

Bring selected object forward - Command 
and ] 

Bring selected object to front - Shift and 
Command and [ 

Move selected object to back - Command 
and [ 

Lock all deselected artwork - Shift and 
Option and Command and 2 


Move anchor point and handles while 
drawing - Pen tool and Spacebar 

Create closed path while drawing - Pencil 
or Brush tool and Option and drag 
Connect path to end of another path - 
Pencil tool and Command and drag 

Cut a straight line - Knife tool and Option 


Add as many of these as you need to 
create the desired gradient. Hit F9 to 
show/hide this palette. 


Actions 


Record and save your commonly used 
commands as Actions. There are loads 
of preset Actions aimed at increasing 
your productivity. 


Swatches 


Create, delete and manage your 
swatches within this palette. The six 
options at the bottom provide options 
for showing and hiding various kinds of 
swatches and creating new ones. 


Transform 


This provides an easy way to shift 
your artwork about the page. Type in 
co-ordinates and hit Return. Shift and 
F8 toggles this palette on and off. 


Styles 


The new Styles palette provides an easy 
way to create, save and share commonly 
used graphic styles. Shift and F5 will 
show/hide this palette. 


Brushes 


Create, Save and Apply custom strokes 
to a path. The app also comes with a 
huge amount of preset brushes. 
Show/hide this palette by tapping F5. 


Layers 

Improvements include an expanded 
Nesting hierarchy and also enhanced 
Palette Display options. Show/hide the 
Layers palette by tapping F7. 


Align 


Align and distribute objects in a blink of 
an eye with the Align palette. For a quick 
way to display it hit Shift and F7. 


Pathfinder 


Perform various path combinations and 
divisions such as Unite and Exclude. 
Show/hide it by hitting Shift and F9. 


Not your Type? 


Here are the essential 
tools and shortcuts that 
will improve your 
productivity tenfold... 


The Type tools (left to right) 

Area Type tool - use ina closed path 
Path Type tool - run text along a path 
Vertical Type tool - use to create 
vertical text 

Vertical Area Type tool - use to type 
vertically within a closed path 
Vertical Path Type tool - use to run 
text vertically along a path 


Shortcuts 

Align text left, right or centre - Shift 
and Command and L, Ror C 

Justify - Shift, Command and J 

Soft Return - Shift and Return 

Reset horizontal scale to 100 per cent 
- Shift and Command and X 

Resets tracking/kerning to 0 - Shift 
and Command and Q 
Increase/decrease point size - Shift 
and Command and > or < 
Increase/decrease leading - Option 
and Up arrow or Down arrow 
Increase/decrease kerning/ tracking 
- Option & Left arrow or Right arrow 
Increase/decrease baseline shift - 
Shift and Option and Up arrow or 


Down arrow 


Other handy shortcuts 
that will aid you in your 
illustrations... 

Constrain proportions - Ellipse, 
Rectangle or Rounded-edge 
Rectangle tool and Shift and drag 
Constrain orientations - Polygon, 
Star or Spiral tool and Shift and drag 
Reposition object while drawing it - 
Any shape tool and Spacebar and 
drag while drawing 

Draw shape from centre - Any shape 
tool and Option and Drag 


Illustration Special 


N Interfaces 


The menus 


These have many functions, 
aimed at making your life 
easier. Jump on board for our 
definitive guide... 


FreeHand 9 


mE as @ File 
The File menu in FreeHand is much like 
any other application - this is where you 
open, save and export your work. You 
can also handily customise keyboard 
shortcuts and toolbars here. 


Edit 


Copy, paste and duplicate your work in 
the Edit menu. As with all FreeHand 
menus, shortcuts are displayed next to 
the name of the operation. 


The View menu enables you to show/ 
hide/lock all helpers such as guides 
and rulers. You'll also find options for 
increasing/decreasing magnification 
and showing the new Perspective Grid. 


Modify 


As with /llustrator, the Modify menu 


Essential tools 


The main FreeHand toolbox, offering the gateway to your vector success. Take a look at our 
guide to some of the handy shortcuts... 


i 
Pointer - [0] # Line - [N] 


Rotate - [F13] Pan - [Spacebar] 
Lasso - [L] Freehand - [Y] Reflect - [F9] Double-click on a tool with an 
arrow in its top-right corner 
Text - [T] Hot Pen -[P] I Scale - [F10] to bring up the tool options. 


Rectangle - [R] ===! Bezigon -[U] 


is 


Skew - [F11] To customise all keyboard 


shortcuts go to 


Polygon - [G] Knife - [K] 
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Magnification - [Z] File>Customise>Shortcuts. 


Bitmap Crop - [C] 


Text editing 


tee 


Text in FreeHand is all a matter of shortcuts. Luckily for you, we’ve got them 


holds the key to successful illustration 
in FreeHand. Transform, Align and 
perform various Pathfinder operations 
from this menu. 


Text 


Utilise all of FreeHand’s superb text 
tools within this menu. Leading, 
runaround, and text formatting options 
can be found here. Options for spelling 
corrections and case conversions are 
also present. For more on using text 
within FreeHand, see the Editing boxout 
on this page. 


Xtras 


The Xtras menu contains all of the 
operations you'll need to perform 
specialist commands such as Release 
to Layers, Create Charts and Delete 
Empty Text Blocks. Handy and 
sometimes vital commands are 

found here. 


Window 


The Window menu enables you to hide 
and display various palettes including 
panels and inspectors. Check out the 
FreeHand Palettes section on page 25 
for more information on all the 
FreeHand palettes. 


Some more shortcuts to 
help you on your way... 
Clone - Command and = 

Close a cut path - CTRL & Knife tool 
Cut contents - Command, Shift and X 
Deselect all - TAB 

Group - Command and G 


Paste inside - Command, Shift and V 
Snap to Guides - Command and 
Option and G 

Snap to Point - Command, Shift, Z 
Thicker stroke - Command, Shift, > 
Thinner stroke - Command and Shift 
and < 


Increase horizontal scale by 5 per 


cent - Command-6 


Kern or track less/more by 1 per 
cent - Command and Option and 


Adjust leading for entire container - 
Drag a top or bottom handle 


Tip: Select the text first! Decrease horizontal scale by 5 per Left/Right arrow Increase/Decrease leading by 100 
Shift baseline up/down by one point cent - Command-3 Kern or track less/more by 10 per cent or 2 points - Command and 
- Command, Option & Up Adjust range kerning for the entire per cent - Command and Shift and -(minus)/+ (plus) 

arrow/Down arrow container - Drag a side handle Option and Left/Right arrow Attach to path - Command,Shift, Y 


Convert to paths - Command, Shift 
and P 


Flow Inside Path - Command and 
Shift and U 

Run Around Selection - Command 
and Option and W 

Spelling panel - Command and 
Option and S 


The palettes 


The sheer amount of 
FreeHand palettes may 
bamboozle even veteran 
vector users, but we offer a 
helping hand... 


Xtra operations 


The FreeHand Xtras toolbar provides 
easy access to tricky commands. 
Simply click a button to display options 
for Trapping, Transparency, Pathfinder 
commands and other useful Xtras. Hit 
Command and Shift and | to access it. 


Xtra tools 


Access all of FreeHand’s superb 
creative Xtras tools from this palette. 
Smudge, Blur and use the intuitive 
Graphic Hose to add an Xtra dimension 
to your artwork. Command and Shift 
and X will bring it up. 


Inspectors 
Object inspector 


The Object inspector enables you to 
manually alter the dimensions and 
position of selected artwork - simply 
type the desired co-ordinates into the 
relevant field. You can also specify 
corner radius. Use Command and | to 
hide/show it. 


Stroke inspector 


As the name implies, use the Stroke 
inspector to define the width and 
appearance of your stroke. You can add 
arrowheads here as well. Command- 
Option-L will open it up. 


Fill inspector 


As you've probably guessed, the Fill 
inspector enables you to define, and 
choose a Fill for selected artwork. 
Among other things, gradients, Lens 
effects and Pattern fills can be created 
here. Probably one of the most 
important aspects of the app. Hit 
Command and Option and F. 


Text inspector 


The Text inspector is an extremely 
important aspect of FreeHand 9. Here, 
you can specify font name, size, leading, 
kerning and baseline shift. Other 
important DIP-esque options reside 
here such as paragraph, spacing and 
column settings. 


Document inspector 


The Document inspector enables you to 
change document settings on the fly, 
including size (A4, A5 and so on), 


The main toolbar 


This will be a familiar sight to FreeHand users, but what a do all those bh: icons do? 


New document - simply creates a 
new document 

Open - open up an existing document 
Save - save the active document 
Import - import a file or object 

Print - exactly what it says on the tin 


Find Graphic - use to find graphics with 
certain attributes within a page, document 
or selection 

Align - this brings up the Align palette (see 
Palettes section) 


Lock - again, reasonably obvious in that it 
locks selected items 

Unlock - situated next to lock, yes, it’s 
unlock selected items 


Object inspector - brings up the Object 
inspector (see Inspector boxout) 
Transform - Pressing this brings up the 
Transform palette 

Colour List - Brings up the Colour 

List palette 

Colour Mixer - brings up the Colour Mixer 
Layers - brings up the Layers palette 
Symbols - brings up the Symbols palette 


portrait or landscape and print 
resolution. You can also add extra pages 
to your document. Hit Command and 
Option and D. 


Panels 


Use Command-Shift-H to hide/show 
all open panels 


Colour/layer/style 


The Colour List, Layers, and Styles 
panels come in one neat package. This 
can be accessed by hitting Command 
and 3, Command and 6 or Command 
and 9. The Colour List is a handy place 
to store all your recently used colours. 
Create a colour in the Colour Mixer 
panel and drag the swatch on to here. 
You can also access and acquire 
colours from different Swatch palettes. 
The Layers palette enables you to 


Create - create an Envelope 
Text field - Envelope preset dropdown 
menu, Use this to define the Envelope 


shape for your selection 


Leading type - displays three different 
ways of displaying leading values (+, = and 
per cent) 


Save as preset - save a Custom Envelope 
effect as a preset 

Delete preset - delete the selected 
Envelope preset 


Four Align buttons - align selected text to 
the right, left centre or justify it 


Copy as path - converts the envelope to 
apath 

Paste as envelope - paste a copied path as 
an Envelope 


Release - release the envelope and retain 
the modifications to the objects 

Remove - remove an envelope and all of its 
modifications to an object 

Show map - shows the envelope map. 


Flow inside path - flow selected text inside 
apath 

Attach to path - attaches selected text toa 
selected path 

Detach from path - detaches the text from 
apath 

Convert to paths - converts selected text 
to paths 


Font name - displays the currently 
selected font name 

Font size - displays the current font size 
Font style - displays the current style 
(plain, bold and so on) 

Edit leading - Use this field to edit the 
leading of selected type 


manage and organise separate layers, 
and the Style panel defines DIP-esque 
style sheets in which you can define 
different styles for different sections. 


Symbols panel 


Just as in Flash, this panel enables 
you to store symbols for reuse 
throughout a document. 


Colour Mixer 


Use this intuitive panel to mix up 
colours for your document. Choose 
between different Colour Picker modes 
and drag the selected colour into the 
Colour List for further use, on a stroke 
or inside a closed path. Command and 
Shift and C is the shortcut. 


Tints panel 


Command and Shift and Z will bring up 
the Tints panel - a handy palette 
enabling you to adjust the tint of a 


Text editor - launches an internal text 
editor in which you can type away to your 
heart's content 

Spelling - check spelling within the 
selected text or document 

Find text - find specific text 

Runaround - adjusts the runaround of 
selected text and objects 


Four text-related buttons - Increase 
leading, decrease leading, increase 
baseline shift, decrease baseline shift 


colour on the Colour List panel in 
an instant. 


Halftone Panel 


This is where you can apply halftone 
screen settings to selected objects, 
overriding the document-wide settings. 
Specify halftone screen settings that 
are different to the settings of the 
document in the current PostScript 
printer description (PPD). Access this 
panel by hitting Command and H. 


Align Panel 


Hit Command and Option and A to 
bring up the Align panel. This enables 
you to align and distribute artwork. 


Transform panel 


The Transform panel can be accessed 
by hitting Command and M. This panel 
enables you to move, rotate, scale skew 
and reflect selected artwork. 
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CorelDRAW 10 


The menus 


Virtually everything should 
be possible from an app’s 
menu system. We check out 
CorelDRAW 10's... 


File 


The Corel File menu is, again, a pretty 
run-of-the-mill File menu. Open, Open 
from a template, Save, Print and 
Publish your artwork to the Web 
among other essential, yet rather 
mundane tasks. 


Edit 


Edit menus within applications really 
don't seem to vary much and 
CorelDRAW 10 is no exception. Apart 
from some rather kooky commands 
such as Insert Barcode, this is a pretty 
normal menu. 


View 


This enables you to view artwork in 
selected Preview modes such as 
Wireframe, Draft and Enhanced. You 
can also access Full-screen and 
Selection previews. In addition, the 
menu gives you the ability to toggle 
Snap To Grid and Guides. 


Effects 


Present in the CorelDRAW 10 Effects 
menu are the effects and special 
operations available in CorelDRAW. 


The Toolbox 


Utilise the excellent PowerClip feature 
which enables you to place graphics 
easily within selections and masks. 


Layout 

The Layout menu enables you to insert 
and delete pages, switch page 
orientation, set the page background 
and generally set up your document. 


Arrange 


Within this menu you can Transform, 
Align, Group Lock and generally 
manage your artwork. 


Bitmap 


Everything to do with bitmaps can be 
found here. Rasterize your artwork and 
then apply various Photoshop-esque 
effects. You can also specify Colour 
modes such as CMYK, LAB and RGB. 


Text 


The Text menu contains exactly what 
you'd expect, Adjust, Organise and 
Align text to paths in here. 


Tools 


Various essential commands live here, 
most notably the Palette editor, in 
which you can specify a Custom palette 
and the Colour Management dialog, 
with which you can set up colour 
separations and so on. 


Window 


This enables you to show/hide various 
dockers, toolbars and palettes. 


Your essential guide to picking tools. Fingers at the ready 


Note: all shortcuts are customisable 


by going to Tools>Customisation. You Polygon tool - [Y] 


can also customise toolbars by 


holding CTRL and Alt and dragging 
the tool to the selected destination. 


(4 Shape tool - [F10] 


Eraser tool - [X] 


on tool -[Z] 


Hand tool -[H] 


[ca] Rectangle tool - [F6] 
|o) Ellipse tool - [F7] 
sc media tool - [I] 
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Ee... paper tool - [D] 
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Outline Pen Dialog -[FI2] 
Outline Colour Dialog - [Shift, F12] 
Fill Colour Dialog - [Shift and FI] 
Fountain Fill Dialog - [FI] 


Py) Interactive Fill tool - [G] 


Interactive Mesh Fill tool - M 


Dockers 


Dockers are Corel’s answer 
to palettes, and contain many 
of the options you'll need to 
survive in CorelDRAW 


Object docker 


Think of the Object Manager as a Layers 
palette and it all becomes clear. 
Manage, Adjust and Move your various 
objects (or Layers, to most of us) here. 


Artistic docker 


The Artistic Media docker holds all 
the brushes you'll need to create 
bitmap-esque vector strokes within 
CorelDRAW. A last used window at the 
top helps you repeat commands easily. 


Extrude docker 


The Extrude docker holds the key to 
creating simulated 3D objects in 
CorelDRAW. Along with the Live 
Extrude tool, use the docker to finalise 
and perfect Extrusions. 


Lens docker 


The Lens docker provides an easy way 
to create and define Lens effects. 
Options include Fisheye, Magnify, 
Transparency and Wireframe. 


Colour docker 


Much like FreeHand’s Mixer panel, 
the Colour docker enables you to mix, 
prepare and apply colour to artwork. 
You can also specify spot colours 
from here. 


Scrapbook docker 


The Scrapbook docker is without doubt 
one of the handiest features of 
CorelDRAW. From here you can browse 
for any image file on your HD and open 
it. Superb. 


Undo docker 


The CorelDRAW Undo docker is very 
much like Photoshop's History palette. 
You can trace every recent stroke or 
transformation - undoing if required. 


Other dockers 


Just so you know, here’s the full list of 
CorelDRAW 10's dockers and the 
relevant shortcuts... 


- Properties 

+ Object Manager 

- Object Data Manager 

- View Manager - CTRL and F12 
~ Link Manager 

* Undo Manager 


The main Property bar 


rot 


me, \ s00e 


CorelDRAW’ context-sensitive Property bar is a central part of the application, but can 
certainly confuse. Check out this guide... 


0297.0 mm ==) 
On opening up the application, the 
Property bar looks pretty blank and sorry 
for itself. A few options for opening and 
saving files are present, but not much else. 
However, as soon as you click on any tool in 
the toolbox, the whole thing springs to life, 
displaying all sorts of helpful options for 
each tool. Being the kind fellows that we 
are, we thought we'd show you the hub of 
CorelDRAW 10, and give you an idea of 
what you can achieve when you click on 
each of the main tools. 


The tools are alive 


Pick tool 

On clicking the Pick tool, the toolbar 
becomes a raging pit of text fields and 
icons. Use these to alter drawing units, 
paper size, paper-orientation and more. 
You can also specify to Snap To Grids/ 
Guides by clicking the relevant icons. 


Shape tool 


No options 


Zoom tool 
Various Zoom options appear, enabling you 


+ Internet Bookmark Manager 
- Artistic Media 


* Blend 

- Contour - CTRL and F9 

- Envelope - CTRL and F7 

- Extrude 

Lens - Alt and F3 

* Bitmap Colour Mask 

+ Transformations (including 
Position, Rotate, Size, Scale and 
Skew dockers) 

+ Shaping (Including Weld, Trim and 
Intersect dockers) 

* Colour 

- Colour Palette Browser 

- Colour Styles 

- Graphic and Text Styles - CTRL and F5 
- Symbols, and special characters - 
CTRL, F11 

- Scrapbook 

- Corel Scripts Manager 

-Web Connector EES 


to specify exact magnification, as well as 
the regular commands such as Zoom to 
Page, Zoom to Selected and Zoom to all 
Objects. All are presented in the form of 


neat icons. 


Freehand tool 

Choose line style, size, angle of rotation 
and arrowheads on the toolbar after 
clicking this tool. In addition you'll find 
co-ordinate entry fields to Transform, 
Move and Align your strokes. 


Rectangle tool 

As with the Freehand tool, the context- 
sensitive Property bar displays Stroke 
Width, Transform and Movement options. 
Some neat arrangement icons at the end 
prove useful, enabling you to move objects 
in front of and behind each other quickly. 


Ellipse tool 
Virtually the same as Rectangle tool 
options apart from the inclusion of Arc 


creation buttons. 


Polygon tool 
Again, similar to the Rectangle options, but 


16.35 mm =) 
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with buttons enabling you to define how 
many sides your polygon has. 


Basic Shapes tool 
Nigh on exactly the same as the Rectangle 
tool options. 


Text tool 

Not quite all the options you would expect 
from a professional illustration package, 
such as kerning and leading but 
nevertheless, you'll find various fields and 
dropdowns enabling you to select fonts and 
format text. 


Interactive Blend tool 

Make your Blends come to life with the 
excellent and, more importantly, 
accessible tools available in the Property 
bar when the tool is clicked. Options to 
modify your Blend range from Number of 
Steps to Colour Acceleration. 


Eyedropper tool 

Not much here, but what is is certainly 
useful - especially the fact that you can 
gain pixel-perfect accuracy with the 1x1 
Pixel Eyedropper button. 


Shortcuts to success 


Some keyboard quickies to help you find your way around 


Viewing and zooming 

Zoom out once - F3 

Zoom in once - Z 

Zoom to objects - F4 

Display entire page - Shift and F4 
Zoom to selected objects - Shift and F2 
Pan up/down/left/right - Alt and 
Up/Down/Left/ Right arrow 


Text Editing 

Display Font List - CTRL and Shift and F 
Decrease font size to previous point size - 
CTRL and Number Pad 2 


Increase font size to next point size - CTRL 
and Number pad 8 

Increase font size to next point size in list - 
CTRL and Number Pad 6 

Decrease font size to previous point size in 
font list - CTRL and Number Pad 4 

Show available font weights - CTRL and 
Shift and W 

Change text to italics - CTRL and | 

Change text to bold -CTRL and B 

Find text in drawing - Alt and F3 

Open Spell Checker - CTRL and F12 

Add Drop Cap - CTRL and Shift and D 
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Learn the basics 


If you've not tried vector illustration 
before, make an enjoyable start 
by creating an online comic book 


nline comics have been 

e around for a while, but since 
the advent of Flash, sites 
such as heavy.com and 
eden.sigma6.com have demonstrated 
the potential of the Web in explosive 
fashion. Flash has enabled many 
independent comic publishers to reach 
a far greater audience, with animation, 
sound and colour — previously beyond 
their budgets — adding greater scope 
to the usual pictorial strips. 

This tutorial is based on a strip from 
the Forgotten Mirrors series written by 
Tim Seelig and drawn by Lee Garbett 
for Dream Factory magazine. The 
original idea behind the magazine was 


to give writers and artists trying to 
establish themselves an opportunity to 
have their work published. The 
magazine's creators are hoping to 
convert all of the strips for the Web so 
they can reach a wider audience. 
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Part 1: Photoshop 


Using Photoshop to prepare your images for conversion 
to vector, adding colour and defining detail 


Unbroken lines 


Before starting work on your 
image, spend a few moments 
checking there are no line 
breaks, and that they're all solid 
black. A simple way to check this 
is with the Photoshop Wand tool: 
use the Contrast Adjustment to 
minimise the greys until they're 
as close to black and white as you 
can get. 


@ Open the file image‘ .jpg which you'll find in 
the dual\tutorial\dream folder on your CD. 
This is a scaled down version of the original 
artwork, adjusted to 72dpi. 


Colour printing costs money but on the Web 
it's just a matter of a few extra kilobytes. 
Carefully add colour using a Web-safe palette, the 
Wand tool and layers. Doing this will result in less 
colour layers to group when you change to vector. 


i, 


We want to separate the two characters from 3 | After you've done this, you will need to 

the background so that we can animate them redraw the man and background. It is a good 
later. The easiest way to do this is to simply separate _idea at this stage to increase the contrast of the 
each part in Photoshop. image — this helps when converting it to vector later. 


Go You'll often need to touch up the colour in the 
images. With the bushes in the background, it 


G With finer detail, such as the eyes on the 


boy, you'll need to use more definition than was also necessary to increase the width of the black 
you usually would to stop details disappearing line to prevent the definition being lost. Finally 
when converted. It often takes a bit of trial and flatten your image. You'll find the flattened versions 
error to get this right, but it's possible to achieve on the coverdisc called image2.tif, image3.tif and 
some really good effects. image4.tif. 


Part 2: Fine-tuning colours 


Not all colours can be reproduced by all browsers on all platforms, so you'll 
need to ensure the palette you use is ‘Web-safe’. Here’s how to do it 


Colouring 


When colouring your image, use 
the Web-safe colour palette in 
Photoshop. To access this, open 
the Colour Palette options and 
check the Only Web Colours box 
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@ After finishing colouring up your images, open 

them in FireWorks or GoLive. These programs 
have the ability to limit the image and colour ranges 
of your images. 


Mac HO:Desktop Folder:dt2:image2.htm 


Choose the ‘2-up' tag above the image — this 
shows a comparison between the original and 3 | After adjustment, save the optimised graphic 


optimised versions. To the right of the image you'll by choosing File>Export. If optimising in the 
see an optimised palette, which offers options to GIF format, you should see a colour palette that 
save the image as different quality JPG or GIF images. —_ allows you to fine-tune your colours. 


Part 3: Introducing FreeHand 


How to create a vector version of your work by 
tracing your images using FreeHand's Trace tool 


Colour to edges 


When tracing your image, make 
sure that the colours match up to 
the image lines. Ideally, you don't 
want any white space within the 
image. If there are areas which 
you want to be white, then it’s 
best to use a shade of white. This 
will stop parts of the image 
becoming transparent during 
your animation. 


4 
3 | To trace the image, double-click the Trace tool 


Create a new document and import image4.tiff in the Tool palette. A dialog will appear, choose 
1 CTRL+R (PC) Apple+R (Mac). A small ‘L’ will You are able to adjust the scale of the Eight colours, RGB, High, Trace All Layers, Outline 
appear. Place this onto the document page and click | 2 | image within FreeHand by simply dragging from the Path Conversion menu; and adjust Trace 
to place your image. The ‘L’ marks the position of any corner. Pressing Shift while doing this will retain | Conformity to Tight, Noise Tolerance to Min and 
the top-left corner of the image. the original proportions of the image. Wand Colour Tolerance to Narrow. Then click OK. 


6 | If you now click on part of the vector image 
and drag, you should see the image separate 
into colours. The number of layers will change 

— - — depending on the palette that you have used. This is 
Using the Pointer tool, drag the image to one why using the Web-safe palette is a good idea — it 
side. You should see the vector image separate _will give you a good idea of how the final image will 
vector version of your image. from the original. look to others. 


4 Using the Trace tool, drag a selected area i 
around the image. You will see the detail of the G 
image surrounded by a path. This has traced a 


We want to collect these Colour layers so 


o You will find that the settings needed foreach >to 
that they're all one object. To do this, select image will vary, so adjust the Trace tool setting 9 To see how the image will look go to 
the image using the Pointer tool. Then go to to increase Colours and Tolerance. Depending on View>Flash Anti-Alias. This smooths out the 
Modify>Group. You will now be able to move the the settings, the Trace tool is able to get the closest edges, so you can check that the colours fit the 
image around without it separating. match to your colours and cut out any stray pixels. lines and don't leave large white gaps. 
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Introducing FreeHand continued... 


rt Document 


(Ge ar2 =) 


@ Selected objects only 


B& Include FreeHand document in EPS 


Cowvert Colors to: |” CMYK ¥ 


@ Open in external application 
<none> 


10) With all components converted and grouped, 
move them into position. If you find that one 
of the images is an incorrect depth, right-clicking 
(PC) or holding down the mouse button (Mac) will 
bring up a menu that enables you to bring the 
graphic to the front. 


We've now finished and want to export these 
images separately in a SWF format. Select an 

image and go to File>Export. In the dialog box, 

choose SWF and Selected Objects Only, and save. 


12] Check that the file has exported correctly by 
opening the file. You will need the Flash Player 
(available from www.macromedia.com) or the latest 
version of QuickTime (from www.apple.com). 


Part 4: Colour matching 


And that's not the only function that the The FreeHand Trace tool can 
perform. Here are a few of the other things this useful tool does 


Colour mode 


When tracing, try to keep the 
colours you use to a minimum. 
The less colour information, the 
smaller the resulting file size. 


FreeHand internally detects the colours of a 

graphic so that when the graphic is traced, it 
can get the closest match. In this tutorial, all images 
are traced at eight colours because the images are 
quite simple and contain block colours. 


a The Colour mode allows you to change, for 

example, an imported RGB image to a grey 
scale or CMYK vector graphic, and other options 
are also possible. 


4 | The Trace tool converts your image into paths. 

The way the image is traced can be adjusted to 
Trace Outline (traces outline of the graphic object), 
Center Line (traces the centre of the graphic edges), 
Center/Outline (combines both previous) or Outer 
Edge (traces only the outline edge of the graphic). 


The Trace Conformity can be adjusted to 
path conforms to the edges of the original graphic. 


0 sets the conformity to its minimum setting and 
creates a smaller vector file. 
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between 0 and 10. This defines how closely the 


High . 


The images we have used are relatively small 

at 72dpi, so if you'd like to get further detail, 
choose High in the Resolution pop-up. When 
working on larger images you'll find that this can 
really slow down your machine. 


G The Noise Tolerance can be adjusted to 
eliminate noise from original images - for small 
detailed images, you need to set this to a minimum 
to keep the detail. The Colour Tolerance adjusts the 
sensitivity of the colour selection. 


Part 5: Using sprites and the timeline 


How to turn your images into an animation in Director 
and export it using the Shockwave format 


Labelling 


Make sure you label all files 

you import or create in Director. 
This will save time and help you 
get organised as your movies get 
more complicated. 


fH image2tir 


background.swt 
boy.swt 


man.swt ‘Span Defauits: (j Otsplay Sprite Frames 
Biweening 


Span Duration: @ [24 | frames 
QWiath of Score Window 
BB Terminate at Markers 


Standard Import = j 


Show Preview 


as Import your three SWF files to Director. 

They can be found on the CD named 
background.swf, man.swf and boy.swf. Adjust the 
stage to 300x400 and set the background to Black. 


You will now be able to arrange the characters 
and background on your stage. In the animation 
we want to get the background to shake before the 


man fades in and the boy slides onto the screen. shake when animated. 


Insert 
Keyframe 


Frames... 


#] 


Remove Frame %[ 


Director automatically sets the Sprite Span 

Duration to 28 frames, which is fine. This 
can be adjusted by going to File>Preferences> 
Sprite. Drag your three cast members from the cast 
onto Channels 1, 2 & 3 of the score. 


8 Select the Background sprite in Channel 1 by 
applying keyframes in the first four frames. By 
selecting each of these, you can use the cursor keys 
to move the background up or down to create a 


a: 


Control 


SID OS | )N i 


1 


In the score you will see the Timeline Indicator 


Film Loop... 


Media Element 


» 
» 


Modify Control 
NO3EK 


(== 


ee | | ER 


lo 
(a) OTe] [ZA] 


t _ 

Gg Select all three sprites and click on the Sprite 
tag in the Property inspector, and select 
Background Transparent. You should now be able 

to see each of the sprites, with the boy in the 
foreground, then the man and background. In 
your score the background should be in Channel 1, 
the man in Channel 2, and boy in Channel 3. 


Ld] 
Go In the score, select the sprite in the Channel 2. 
Move this sprite to Frame 5 then select the 
sprite in Channel 3 and move this to Frame 10. 


~ this is the red line that shows your position in 
your movie. By moving this you'll see the sprites 
appear as you drag it along, check that the sprites 
are all positioned correctly. 


8 | To create animation, we need to add keyframes 


@ Repeat Step 8 for the end of the sprite and for 
Sprite 3. Select the end of Sprite 2 and drag it 
back to Sprite 28 in the score so it finishes at the 
same position as Sprite 1. Make sure the sprite line is 
shortening and not moving. Repeat this for Sprite 3. 


to Sprites 1 and 2. To do this, click on the end 
of Sprite 2 in Frame 5 of the score. With only that 
fame of the sprite selected, go to Insert>Keyframe 
using CTRL+Alt+K (PC) or AlttApple+K (Mac). 
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Part 5: Using sprites and the timeline continued... 


Changing several 
images 
Hold down Shift to select sprites 


in the Score channels. You can 
then adjust these in one go 


on exitFrame me 
go to the frame 


through the Property inspector. 


end 


10] Pushing Play at this stage will simply cause the 
movie to loop. We want the movie to stop 
when it gets to Frame 28. To do this we need to use 
a small bit of Lingo. Double-click in the score script 
above Frame 28 in the score. A script window will 
appear containing the script ‘on mouseup'. Below 
that, enter ‘go to the frame’ and close the window. 


13} Repeat this process to add the text. As the movie 
is relatively small, click the Moveable Sprite 
button in the Property inspector to make the text 
movable — this just gives viewers a nice extra option. 


Save and Compact 
Save All 


Create Projector... 
Publish Settings... 
Publish >eS 


Preview in Browser 
Page Setup... <38P 


irate fo! 
sCAPRESRPE EGS 30D 


Recent Movies 
Recent Casts 


#P 


16) To publish your finished movie, simply go to 
File>Publish. This will save the Shockwave file 
and create the HTML code to harness it. 
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To animate the man, select Frame 10 of Sprite 3 
and move the sprite off the screen with the 
cursor keys while pressing the Shift key. You should 
see a line appear from the sprite registration point 
to its original position. 


oO We'll start by fading in the man. Simply select 12] 
Frame 5 of Sprite 2, then take the Blend down 
to 10 per cent in the Property inspector. Click on 


Frame 28 and check that the Blend is 100 per cent. 


14 | The page is pretty much finished, so we'll go to 
File>Publish Settings. A pop-up window will 
appear. Here choose Center Shockwave from the 
HTML template and name the HTML and DCR files. 


15 Leave the settings in the General section. In the 
Shockwave section, choose No Stretching from 
the Stretch style and check that the background is 
set to Black. OK this to close down the window. 


Obviously this is just one cell from a strip: 
some kind of navigation is going to be 
needed. Create a series of buttons using Director's 
Behaviour inspector, use the Go to Netpage to 
navigate, in a similar way to a standard Website. 


The finished strip is part of the Dream Factory 
magazine, and it can be viewed in its entirety 
at www.v-42.demon.co.uk EEE 


, AUTHORISED 
TRAINING PROGRAMME 


Illustration Special 35 
arts 


Illustrator 9 tips 


Illustrator 9 offers a whole bunch of new and exciting 


design tools. Try these out on the PC and Mac 


General tips 
Tearing off tools 


You can tear off and float /llustrator’s 
toolbar flyouts by dragging across to the 
little grab bar at the right and releasing 
the mouse. These floating toolbars will 


snap into alignment with each other, too. 


Expanding palettes 

Most /llustrator palettes/tabs have 
three states: minimised (title bar only), 
compact and expanded. Cycle through 
these views using the little double- 
headed arrow gadget to the left of the 
palette name. 


Hide all palettes 
Do you get fed up with having too many 
palettes cluttering up your screen? Hit 
Tab to hide the lot of them, then hit Tab 
again to restore them. 


Docking palettes 

You'll know by now that you can drag 
palettes together to create multiple 
tabbed palettes. But did you know you 
can drag tabs to the BOTTOM of 
palettes to create palette ‘towers’ that 
can be moved around as a single unit. 


Artboard and Print setup 


Whatever document size you chose 
when you created the new one, you 
can change the Artboard size via the 
File>Document setup. Might as well 
choose your printer at the same time 
to have /llustrator display the printable 
area, too. 


Navigation aid 

Is the Navigator thumbnail a bit too 
small to help you navigate around 
easily? Then drag the resize handle, 
bottom right, to make it as big as you 
like — the thumbnail scales up with 
the window size. 


Type can be filled, rotated and stroked, all 
without losing its editability. And you can even 
Convert it to curves for more advanced editing. 
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Zooming out 

Now that you've zoomed in by clicking 
on the page with the Zoom tool, how do 
you Zoom out again? By holding down 
Alt and clicking again. Hit CTRL-0 to 
view the whole page. 


Status bar 


Never paid any attention to the Status 
bar to the bottom left of the window? 
Click the pop-up to change the display 
to the current date and time, the 
document colour space and other 
interesting factoids. 


Tool options 

Try double-clicking on any tool — you'll 
get a whole list of options for customising 
the tool or controlling the effect. 


Specific sizes 

You want rectangles or ellipses at 
specific sizes? You could draw them 
and resize them manually... or you could 
just click on the page instead of dragging 
and type the values in at the start. 


Pixel preview 

How are your vector graphics going to 
look when you export them as bitmaps 
for the web? There’s no need to guess — 
hit CTRL-Alt-Y to switch to /Ilustrators 
on-screen Pixel Preview mode. 


Web-safe colours 

Choose Web Safe RGB from the Colour 
palette’s pop-up menu to stick to 
colours that won't dither on Web pages. 


Save for Web 


Did we give you that tip just a little too 
late? You can convert images to 
Web-safe colour palettes via the Save 
for Web option on the File menu. 


New views 

You can look at two parts of your 
artwork at the same time by creating a 
new Window from the View menu. 


Custom views 

Tired of tedious panning and zooming? 
Create custom views for specific areas 
of your work. Zoom in to the area, choose 
View>New View, name it and it's added 
to the bottom of the View menu. 


Double-click zooming 


Double-click the Zoom tool to view your 


You can drag and drop palettes to make your own grouped palettes, but you can also 
dock palettes to the bottom of others to make them move around as a single entity. 


artwork at actual size, double-click the 
hand tool to fit it to the screen. 


Shortcuts 


Don't like /llustrators keyboard 
shortcuts? Then define your own via 
Edit>Keyboard Shortcuts. 


Changing units 

You don't have to change /Ilustrator’s 
Global preferences if you want to use 
specific units in a document. Instead, 
choose File>Document Setup and 
choose your units here. 


Who needs a calculator? 

Any /llustrator palette or dialog field 
that accepts numerical input can also 
accept simple mathematical 
expressions, such as 14/3 or 21'6. 


Guides versus Grids 

Horizontal and vertical guides are good 
for ad hoc alignment, but Grids consist 
of both at regular intervals you choose. 
Perfect for sharp, rectilinear layouts 
and rapid alignment. 


Transparency grid 

If you prefer working against a 
Photoshop-style transparency grid 
rather than the default white artboard, 
just hit Shift-CTRL-D. Use the same 
shortcut to switch back to a white 
background if you find that you don't 
like it after all! 


Actions 

Like Photoshop, Illustrator 9 can record 
sequences of events as actions (Actions 
palette). Don't forget that it can also 
carry out batch processing, via the 


palette’s pop-up menu, applying your 
chosen actions to multiple files. 


Soft proofing 

You can rush your clients ‘soft’ proofs 
via the Save As command and the PDF 
option in the file type pop-up. Attach it 
to an email, send it off, go home. 


Drawing 


Constraining shapes 
Shift-drag to create perfect squares 
and circles, Alt-drag to draw from the 
centre rather than the corner and use 
both together if you like. 


Simplify paths 

Paths with fewer nodes are easier to edit 
and faster to print. Select a path, choose 
Object>Path>Simplify and you can 
balance smoothness against accuracy. 


Closed pencil paths 

Paths drawn with the Pencil or Brush tool, 
will close automatically on release of 
the mouse button if you hold down Alt 
as you draw (don't release Alt first). 


Node nonce 

Getting in a muddle over node types? 
Basically, there are only two: smooth 
nodes and corner nodes. Smooth nodes 
have handles which form a straight line, 
corner nodes have handles which move 
independently, or no handles at all if 
they're on the end of a straight segment. 


Converting nodes 


The node convert tool is easy to use 
when you know how. You drag on a node 


to convert it to a smooth node and 
extend its handles. You click on a node 
to make it a corner node. 


Handle help 


Are your nodes’ handles so close to the 
node you can't select them? Drag the 
adjacent segment slightly and the 
handle will emerge. 


Selecting nodes 

The Direct Selection tool can be a right 
pain. Click an object in the wrong way 
and you select it and all its nodes at the 
same time — drag one, you drag them 
all. If that happens, just use the tool to 
drag a marquee round the node or 
nodes you want. 


Joining paths 

Joining paths is easy. Click on one end 
point with the Pen tool, create any extra 
nodes or segments you need in the 
usual way, then move the pointer over 
the second endpoint and watch for it to 
change to indicate you can now click to 
join up with that second path. 


Offset paths 


You can create concentric shapes by 
creating duplicates with an offset path 
applied either via the Path menu or as 
an Effect. 


Free Transform tool 

At first sight, it’s hard to see what the 
Free Transform tool does that the 
Selection tool doesn’t — both let you 
move, resize and rotate objects. Ah, 
but if you click on a side or corner 
handle then hold down the CTRL key as 
you drag, you can shear and distort 
objects. Hold down Shift-CTRL-Alt as 
you drag on corners to apply a 
perspective effect. 


Arrowheads 

You can add arrowheads to lines as 
Effects or Filters. If you apply them as a 
Filter (Filter>Stylize>Add Arrowheads), 
you can edit the arrowhead nodes 
manually afterwards. 


Strokes to outlines 

You'll often create a nice stroke and 
then wish you'd created a shape 
instead. So select the stroke and 
choose Object>Path>Outline Stroke. 


Objects and colour 


Duplicating objects 

Don't use the Ctrl-D shortcut to 
duplicate objects because that’s 
reserved for repeating your last 
transformation. Option-drag the 
object instead. 


You don't have to rasterise your graphics 
to preview them for Web use — just switch 
on the Pixel Preview mode. 


Object styles 

Illustrator 9’s object styles are 
pathetically easy to use. Style up an 
object manually, copy the object to the 
Styles palette, then just drag the style 
on to any new objects as required. 


Layers and objects 

Noticed that /llustrator 9’s Layers 
palette is now an object manager, too? 
Click the right-facing arrows to expand 
the list of objects on a layer. Grouped 
objects are displayed as sub-lists. 


Naming objects 

You can rename layers and individual 
objects by double-clicking their names 
in the Layers palette. Select any object 
by clicking the round button to the right 
of its name. 


Release to layers 

Select any layer and then use the 
Release to Layers command on the 
palette pop-up to place each object on 
a layer of its own — ideal for preparing 
Flash frames or animated GIFs. 


Transparency 

Illustrator 9, at last, supports 
transparency. Not just in layers, though, 
but in individual objects and groups. To 
adjust a layer’s transparency, make sure 
it’s selected in the Layers palette first. 


Opacity masks 

You can create incredibly sophisticated 
transparency effects by creating a new 
object to act as a mask placed over 
another. Select both, then choose Make 
Opacity Mask from the Transparency 
palette’s pop-up menu. 


Selecting similar objects 


Uh oh. You’ve just painted a rather nice 
collection of strokes on top of other 
objects, and now you've realised they'd 
be much better arranged as a group. 
Have you got to Shift-select them all 
manually? No — select one, choose 


Edit>Select and then choose a common 


property they all share (Fill colour, 
Stroke, Weight, Opacity and more). 


Illustrator’s idiosyncratic node editing 
can trip you up. We show you how to get 
those Béziers under control. 


Embedding versus linking 
When you place graphics in your 
artwork, you're given the option of 
Linking them. Uncheck this box to 
embed them in the file. Leave it 
checked if you want to carry on editing 
big bitmaps in Photoshop, say, updating 
your /llustrator file (via the Links 
palette) as necessary. 


Edit originals 

You can edit linked objects using 
their original applications simply 
by selecting them in your /llustrator 
document and then choosing 
Edit>Edit Original. 


Tracing bitmaps 

Illustrator 9 can ‘dim’ bitmap images for 
manual tracing but, quite frankly, it’s 
quicker just to select the bitmap and 
whack its transparency down to around 
20 per cent. 


Aligning and distributing 


Don't worry about getting multiple 
copies of objects lined up precisely as 
you create them. All you need to do is 
select the lot when you've finished and 


use the simple alignment/distribution 
buttons on the Align palette. 


Clipping masks 

You can mask one object with another 
by placing the mask object on top, 
selecting both and hitting Ctrl-7. Use 
the Direct Selection tool if you want to 
move the masked object within the mask. 


Colours or swatches? 

By all means create and use your own 
colours on-the-fly using the Color 
palette. But if you select your new object 
and create a new swatch via the palette’s 
pop-up menu, you'll be able to re-use 
that colour and change all instances in 
your artwork by editing the swatch. 


Easy pattern swatches 

To create a new pattern swatch, just 
drag an object to the Swatches palette. 
And that’s it. It doesn’t get much easier! 


Gradient mesh tips 

Meshes are powerful, but not so easy to 
grasp. To create them, click the object, 
click the Mesh tool and click in the 
object to create Mesh nodes. To colour 
the mesh, click Nodes or Mesh Patches 
then click a colour or swatch. 


Meshes made easy(er) 

Click on an object, choose 
Object/Create Gradient Mesh, then 
experiment with mesh rows and 
columns with the Preview box checked. 
You can create some nice button and 
bevel effects this way without any 
time-consuming mesh node editing. 


Judging by Appearances 
Outline width, Colour, Fill, Transparency 
and Effects are all Appearances — they 


Illustrator’s Layers palette now also doubles as an object manager, and its Transparency 
and Opacity masks enable you to create photo-realistic effects. 
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Carrot 


— 

—— 
Excellent choice for home gardens. 
‘Tremendously sweet. Strong stems make 
harvesting a breeze. Firm yet moist. Ideal 
for salads or juicing. 


nce. Strong sweet taste. 
gelient in salads or stir 


Styles, swatches and brushes are extremely easy to set up, and combine quick 
image creation with consistency throughout your work. 


don't affect the underlying object 
structure. And you can view and edit an 
object's properties en masse via the 
Appearances palette. Appearances 
work alongside Styles, which are simply 
saved sets of Appearances. 


Text 
Type and shapes 


You can type text directly onto your 
artwork. Open the Type tools flyout, 
though, for more options. You can type 
on to paths, type into shapes and create 
horizontal or vertical type in both cases. 


Graphs 

It's a designer nightmare — the boffins 
want graphs, and they expect you to do 
them. Well /llustrator has a remarkably 


powerful Graph tool, directly below the 
Free Transform tool — try it and see. 


Brushed type 

There’s nothing to stop you applying 
Scatter, Art or Pattern brush effects to 
type — just convert it to Outlines first. 


Vertical type 

You can rotate type like any other 
object. But what if you want real vertical 
type, where the letters are horizontal 
but arranged in a vertical stack? Open 
the Type flyout and you'll find the tool 
you need. 


Just your type 


You can use any colour or pattern on 
your type — and on individual 
characters (use the Type tool to select 
them) too. Characters normally just 


CorelDRAW 9 tips 


CorelDRAW 9 is packed to the brim with clever features and options, 
but sometimes you've got to know where to look to find them... 


General tips 


Create and save 

workspaces 

It can take a while to get your dockers 
and toolbars the way you want them, so 
it’s a pain when someone else swaps 
them all round again. But you can save 
multiple workspaces via Tools>Options. 


Display flyouts as toolbars 
Fed up with all those flyouts? Then why 
not drag them off the toolbar and float 
them as palettes or dock them to the 
screen edges? 
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Browsing with Scrapbook 

The Scrapbook is a great way to browse 
your directories for CorelDRAW files 
and images to import. You'll find it 
under Windows>Dockers, and it’s a lot 
easier than hunting for files using the 
Open dialog. 


Auto Backup 


CorelDRAW can automatically back up 
your work at fixed intervals to guard 
against crashing. Switch it on via the 
Options dialog (Workspace>Save) and 
then switch it off again if it starts getting 
on your nerves. 


have a fill, but you can apply a stroke 
outline if you like. 


Copying type attributes 

Select the text you want to modify, click 
the Eyedropper tool, then click on the 
text whose properties you want to use. 


Linking text frames 

To link two text frames so that one 
overflows into another, select them both 
and choose Type>Blocks>Link. They're 
now joined as a group, too, and can be 
moved and scaled as one. 


Effects 


Filters versus Effects 

Why do you get — apparently — the 
same list of options on the Filters and 
Effects menus? Filters apply permanent 
changes, but Effects can be undone... 
very handy. 


Rasterising objects 

Click on any object and choose 
Object/Rasterise to convert it toa 
bitmap. You can choose a resolution 
and — new to /llustrator 9 — a white or 
transparent background. 


Custom brushes 

It’s easy to create custom brushes, but 
they're stored with the current file only. 
One solution is to create a template file, 
another is simply to copy a ‘brushed’ 
object from one file to another. The 
second file then has a copy of the brush. 


Scatter versus Art brushes 


Scatter brushes scatter multiple copies 
of the same object along a path; Art 


Hide the page border 

Distracted by the page border 
CorelDRAW displays to represent the 
drawing area? Wish you could work ona 
blank screen instead? Open the Options 
window, choose Document, then Page 


and uncheck the Show page border box. 


Set rulers to pixels 

The Document/ Rulers tab in the 
Options window lets you choose pixels 
as the unit of measurement for your 
rulers. You can specify the resolution, 
too, to help you prepare bitmaps for 
print and Web. 


brushes simply elongate a single object 
to fit the path length. 


Pattern brushes 

These are more complex than ordinary 
types, and work best with rectilinear 
shapes. You have to define five ‘tiles’ to 
represent sides, inside corners, outside 
corners and endpoints. 


Creating brushes 

This is just so simple. Create an object, 
drag it to the Brushes palette, choose 
which type of brush you want it to be. 


Feathering objects 

How can you feather the edges of vector 
objects? It can't be done, can it? One 
way is to use an Opacity mask, another 
is to do it via Effect>Stylize>Feather... 


Morphing effects 

You could use /llustrator’s blending 
tools to progressively transform one 
shape into another via any number of 
intermediate objects, then use the 
Release To Layers command to export 
them as animation frames. 


Blends on paths 

Once you've created a blend you can 
run it along the path by selecting the 
blend and the path and then choosing 
Object>Blend>Replace Spine. You can 
even modify the path afterwards. 


Mosaic Filter 

Any image editor can turn a bitmap into 
a mosaic, but /llustrator can produce 
vector- rather than pixel-based tiles, 
giving you more control. You can lift 
pieces out and give them drop shadows, 
for example, or scatter them around. 


View Manager 

Fed up of manually zooming in on the 
same old objects? Open the View 
Manager (Tools menu), zoom in on your 
object, click the ‘+’ button to add that 
view and right-click (optionally) to 
rename it. To choose any view from 

the list, right-click and choose Switch 
to View. 


Full-screen preview 

Sometimes the interface just gets in the 
way of your artwork. To see what it looks 
like without all that clutter, hit F9. Hit 
any key to get back to the normal view. 


With Spraylists you can ‘spray’ objects along 
a path, using simple shapes or even clip-art. 


Undo List 


Why hasn't CorelDRAW got a History 
function like Photoshop's? It has, of a 
sort. Click the arrow next to the Undo 
button to see a list of past actions, then 
undo as many as you like. 


Changing default styles 
Manually changing CorelDRAW’s 
default text, Outline and Fill styles 
every time you create a new drawing is 
a bore. Instead, click on the tool and 
change the properties before you create 
anything — this changes the defaults. 


Export bitmaps 

Yes, CorelDraw’s a vector-based 
application, but it can export bitmaps 
for Web pages at the drop of a hat (File 
menu). You can render your drawings at 
any size and resolution you like. 


Soft proofing 

Your clients want a proof. They want it 
now, they don't have CorelDRAW and 
they'd only muck up your illo if they did. 
What do you do? You Publish a PDF (File 
menu) instead, and attach it to an email. 


Drawing 


Dimensioning tools for CAD 
CorelDRAW isn't just a drawing 
package — you can use it for CAD too. 
Use the Dimensioning tool (on the same 
flyout as the Freehand tool) to attach 
dimension lines to objects; they will 
update when you resize the object. 


Flowcharts and connectors 
Use connector lines to dynamically join 
objects. The tool snaps to connector 
Points on objects as you move the 
pointer. When you move objects, the 
connector moves with them. 


Drawing scales 

Handily enough, you can set 
CorelDRAWss dimension line scales so 
that 1mm in your drawing, for example, 
is displayed as 1m by the dimension 
tool. Set the scale via the Options 
window and the Document/Rulers tab. 


You can edit grouped objects, including their 
nodes, by Ctrl-clicking to select them. 


Convert polygons to curves 
You're trying to reshape a rectangle and 
all that happens is that you get rounded 
corners! You've got to convert simple 
shapes like rectangles, ellipses and 
polygons to curves (CTRL-Q) first, see? 


Constraining shapes 

When you're drawing shapes or 
polygons, hold down the Ctrl key to 
constrain ellipses to circles, rectangles 
to squares etc, and hold down Shift to 
draw from the centre. 


Control-click grouped objects 
Sometimes you have to group objects to 
make them easier to manage, but then 
you can't select them and edit them 
individually, can you? You can if you 
CTRL-click them. 


Adding to curves 

Darn it — you’ve finished a curve before 
you meant to! Never mind, pick up where 
you left off by positioning the pointer 
within five pixels of the current end 
point and clicking to start drawing again. 


Erase while drawing 

If your freehand curve hasn't gone quite 
the way you wanted it to, don't release 
the mouse button just yet. Instead, hold 
down Shift and backtrack to erase the 
dodgy section, release the Shift key and 
carry on drawing. 


Reposition nodes while 

you draw 

Bezier curves can go wrong too. If the 
last node you drew is in the wrong 
place, press the Alt key and drag it with 
the mouse. Release Alt to pick up where 
you left off. 


Area-drag to select 
multiple nodes 

You can select, move and convert 
multiple nodes by selecting an object 
with the Shape tool and dragging a 
marquee around the nodes to select. 


Add multiple nodes 


You can add nodes to curve segments 
manually, but when you need more than 


one there's a quicker way. Select the 
nodes at either end then use the Add 
Node button on the Property bar. Keep 
clicking to add more nodes. 


Transforming parts of a curve 
As well as applying transformations to 
whole curves and shapes, you can also 
transform parts of them. With the Shape 
tool, select all the nodes you want to 
transform, then Rotate, Stretch Scale 
and Skew using the Property bar buttons. 


Converting segments 

not nodes 

If your curves are the wrong shape, it's 
often easier to convert the segment 
rather than the node. Select it with the 
Shape tool (look for the black blob to 
show it’s selected) then use the Curve 
Conversion buttons on the Property bar. 


Extract subpath 


If you want to separate one part of a 
shape or path, don't go messing around 
with the Knife or Eraser tools. Instead, 
select the nodes you want with the 
Shape tool, hit the Break Curve button 
then CTRL-K to separate the paths. 


Callout lines 

Annotated diagrams are easy in 
CorelDRAW. Choose the Dimensioning 
tool and you'll see it has a Callout 
variant. This anchors one end of a line to 
an object’s Snap point and places a text 
cursor at the other. 


Grouping versus combining 
There's a subtle difference between 
Combining and Grouping. Grouping 
simply makes different objects stick 
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together, while Combining produces a 
single path (with subpaths) and a single 
filland stroke. 


Convert outline to object 

How often have you drawn the most 
wonderful stroke in the world and then 
wished it was a shape instead so you 
could alter its width selectively along 
its length? Easy, use Shift-CTRL-Q. 


Leaving cut shapes open 

Using the Knife tool on a closed shape 
automatically closes the new shapes 
you create. If you want them left open, 
de-select the Auto-Close button on the 
Property bar. 


Objects and fills 


Rotated guidelines 

Horizontal guides? Yes, we know about 
those, and vertical guides too. Ah, but 
CorelDRAW also lets you create 
slanted guides. They're a bit trickier, 
though — you have to open the 
View>Guidelines setup option and 
specify the position/angle manually. 


Absolute guide positioning 
You can drag guides around once 
they're created and change the rotation 
of slanted guides by clicking on them 
twice (not double-clicking). You can set 
absolute positions for any guides via 
View>Guidelines setup. 


Filling open curves 

By default CorelDRAW will only fill 
closed curves. You can soon fix that via 
the Options window, clicking on the 


sz 


| —— 6.50 meters 


Who needs CAD software? With CorelDRAW’s Dimensioning tools and its variants 
you can quickly create scaled drawings and annotations. 
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You edit Mesh fills by dragging the nodes and handles to control the direction of the 


gradients. You can apply colour to nodes and patches (mesh cells). 


Document/General tab and checking 
the Fill Open Curves box. 


Nudge and Super Nudge 

By default you can Nudge objects 0.1 
inches at a time via the arrow keys. You 
can change this distance via the 
Workspace/ Edit tab of the Options 
window. Hold down Shift and you get a 
Super Nudge. 


Select open curves as filled 

Selecting unfilled objects can be tricky 
since you have to click carefully on their 
outlines. Unless you right-click the Pick 
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tool, choose Properties and check the 
Treat All Objects As Filled box. Now you 
only have to click within the shape’s 
outline to select it. 


Alt-click to select 

stacked objects 

How do you get to objects stacked 
below other objects? You Alt-click to 
move progressively down through 
the stack. 


Cloning 


Cloning’s a great way of creating a 
series of identical objects or even 


20 Fontographer tips 


1. Before generating a font, select all then 
choose Correct Path Direction. This will 
ensure all counters print transparent. 


2. Use the Get Reference command 
wherever possible. Apart from automatically 
updating each copy from the original, it'll 
make the font file smaller. 


3. To import from //lustrator or FreeHand 
more easily, instead of saving and importing 
each character separately batch up 8-10 
characters on a baseline, import to 
Fontographer as one file, then redistribute 
to the correct character slots. 


4. Fontographer has a useful selection of 
print layouts that can be accessed directly 
without having to generate a file and take it 
into another program. These include 
characters at a multitude of sizes on one 
sheet, kerning pairs only, a key map (so it's 
easy to locate that weird character from the 
keyboard) and sample text files. 


5. Some versions of Fontographer have an 
auto space and an auto kern feature. 
Tempting though it may be to use these to 
skip what is certainly the dullest and most 
repetitive part of designing a font, avoid 


them. No-one has yet written an auto kern 
program that works at more than a 
rudimentary level. There is no substitute for 
doing it by hand and eye. 


6. If you're designing a Dingbat font, stick 
to just the lower case and capital A-Z slots, 
plus the numbers. Though you could fill 
every slot in the 255-odd matrix, you'll 
never find them all from the keyboard. 
Spread them over several fonts if need be. 


7. For music-industry work, a P in a circle 
(for publishing) is a necessity. This character 
isn't allowed for in the standard Adobe 
character set, but most people place it in the 
tt (pi) slot. This brings it up when you type 
Alt-p. 


8. The Change Weight function is a 
powerful too! — but having changed the 
weight, the optical tweaks will all have to be 
adjusted. Otherwise your new heavier font 
will just appear over-inked. 


9. Italics are generally not simply a slanted 
version of the upright. Some characters can 
have more cursive forms (eg: a or g), and in 
some cases the entire font is redesigned. 
The stroke thicknesses are thrown out — for 


symmetrical shapes like vases. Draw 
one side, clone the curve and flip it to 
produce the opposite side. Any node 
editing you do on the original is 
reflected in the clone. 


Multiple duplication 


You can paint multiple copies of the 
same object by selecting it with the 
Pick tool and, with the mouse button 
still pressed, holding down the 
Spacebar and dragging. 


Scaling outlines with objects 


When you scale an object, the stroke can 
be scaled too? The Scale With Image 
checkbox is in the Outline Pen dialog. 


Autotracing bitmaps 


You can autotrace bitmap logos and 
other simple artwork by clicking on an 
imported bitmap with the Freehand or 
Bezier tool. Don't try it on photos — it 
takes ages and the results are rubbish. 


Brush versus Object Sprayer 
What's the difference between the 
Brush tool and the Object Sprayer? 
Both apply shapes or objects to curves, 
but the Brush elongates the object to 
the length of the curve, while the Object 
Sprayer repeats it along the curve. 


Scrapbook fills and outlines 


You can keep your favourite fills and 
outlines for future use by opening the 
Favorite Fills and Outlines docker and 


example a V will become thicker on one side 
than the other. These problems will need 
adjustment manually. 


10. Call the weights in a family something 
descriptive. Medium, Bold, Light etc may be 
the usual standard, but when you are 
selecting a font by name from a large range 
of weights it'll save a lot of trial and error. 


11. Kern every combination. You may think 
that a ‘k’ is never followed by a ‘q’, but 
someone somewhere in some obscure 
language does. Or a new band called kqxz 
will plaster your font at a 4-foot cap height 
on the side of a bus to advertise their new 
album, and all you'll see is the bad spacing. 


12. Kern caps with caps, caps with lower 
case, lower case with lower case, numbers 
with numbers, everything with punctuation. 


13. In a multi-weight family, the kerning can 
be imported from an existing weight and 
adjusted. This is much quicker than starting 
from scratch. 


14. ‘Lining numerals’ all have the exact 
same width so they work well in tables. 
While this is a good idea in a text font, it's 


dragging objects onto it to save their 
properties. Just drag the fill/ outline off 
the docker to apply them. 


Creating Spraylists 

The Object Sprayer uses Spraylists, and 
you can create your own. Create a new 
one via the pop-up Spraylist File list on 
the Property bar, then click on objects 
in your drawing, adding them to the new 
Spraylist. Then click the Save button 
and give your Spraylist a name. 


Use styles for global changes 
You can create text styles and graphic 
styles in CorelDRAW. Why bother? 
Because you can change styles later on, 
and all objects using those styles are 
updated automatically. 


Pattern Fill types 


Full-colour patterns use scalable vector 
objects rather than bitmaps. Create your 
own via Tools>Create>Pattern. 


Mesh fills 


Mesh fills are very clever, but initially 
bewildering to use. The secret is that 
you can only apply colours to the nodes 
where mesh lines join. The other nodes 
are merely for shaping the direction of 
the gradients. 


Add colours to mesh patches 


Ah, but you can add colours to mesh 
patches too. Select the patch and 
choose a colour. Simple as that! 


unlikely that a headline font will be put to 
such a use so space each numeral individually. 


15. Test your font. Selling someone a font 
that refuses to print on deadline day is not 
going to make your foundry popular. 


16. Run your font out on a high resolution 
bromide at a reasonable size. Check all 
the character shapes for glitches with a 
linen-tester. 


17. Design accents to look good on all the 
relevant letters — if they are the same weight 
as the caps, they will look far too heavy on 
the lowercase. 


18. The new Euro symbol goes in the old 
slot for ‘currency’. This appears as Alt-2. 


19. Keep the points on curves to the 
extreme top, bottom, left and right . The 
Clean up Paths function will do this for you, 
and can be fine-tuned to avoid distorting 
the character's shape. This is essential for 
clean printing. 


20. If imported images are grey or white in 
Preview mode, set the tint to 100 per cent in 
the Selection Info box. 


Parent and child colours 

Using colour styles ensures consistency 
across your document, but you can also 
create ‘child’ colour styles using 
different tints or strengths of the parent 
colour. Update the parent and the 
child’s colour is shifted, too. Useful for 
spot colour work. 


Text 


Artistic versus Paragraph text 
CorelDRAW offers Artistic text for 
single-line text effects and Paragraph 
text for longer passages. To create 
Artistic text, just click and type; to 
create Paragraph text, drag out a 
rectangle first. 


Multi-page documents 
CorelDRAW does page layout too, you 
know. Multi-column, linked text frames 
and multi-page documents are no 
problem. Look for the page 
creation/navigation tools to the bottom 
left of the window and use the Object 
Manager docker to locate and select 
specific objects. 


Extrude symbols 

You can create a whole array of buttons 
and other shapes using Dingbats or 
other symbol fonts. Try converting them 
to curves for fancier editing, or 
extruding them as 3D shapes. 


Fitting text to frame 

You can fit text to a frame by selecting 
the frame and choosing Text>Fit Text To 
Frame. If the frame is linked as part of a 
text chain, the text is made to fit the 
whole chain. 


Creating inline graphics 

You can anchor objects as inline 
graphics in text. Right-drag the object 
over the text until the insertion point is 
visible, release the button and choose 
Move Here. 


Re-floating inline graphics 
You can ‘re-float’ inline graphics by 
selecting them with the Text tool then 
right-dragging them away from the text. 


Rotate and shift text 
characters 

You can rotate and shift characters 
vertically and horizontally in Artistic 
and Paragraph text. Select the 
character's to be rotated/shifted, open 
the Format Text dialog (Ctrl-T) and type 
in values for each. 


Drop caps and hanging 
indents 

CorelDRAW can create drop caps — but 
it can also create hanging indents, 
where the initial letter is offset to the 
left, outside the left margin of the rest of 
the text. Apply both by hitting Ctrl-T 
and clicking the Effects tab. 


Inserting text in objects 

You run text along a path by selecting 
the path, choosing the Text tool and 
moving the pointer over the path until 
the cursor changes. You can do the 
same thing with shapes — and when 
the little AB cursor appears, you can 
type directly into shapes and use them 
as frames. 


Type Assist 
How’s your memory? What's your 
spelling like? If the answer's ‘bad’ in 


Use the Scrapbook docker (it floats, too!) to access everything from clip-art to 


fills. You can store your own favourite fills and outlines here too. 


both cases, open Text>Writing 
Tools>Type Assist. CorelDRAW can 
automatically correct common 
mistakes, substitute full technical terms 
for acronyms and more. 


Effects 


Distorting with envelopes 
Need to tweak an object’s shape or 
perspective, but don't fancy all that 
manual node-editing? Then use the 
Interactive Envelope tool instead. You 
can always remove the envelope later if 
you need to. 


Drop shadow resolution 
CorelDRAWs drop shadows are 
bitmaps rather than vector objects, so 
you need to keep an eye on the 
resolution they're rendered at. This is 


set in the Options dialog, under 
Document>General. 


PowerClip objects 

You can place one object ‘inside’ 
another using PowerClip. Click an 
object, choose Effects>PowerClip> 
Place inside container, then point to the 
shape you want to act as the container. 


Clear all transformations 

In the middle of a transformation that’s 

going horribly wrong and that you wish 

you hadn't started, press Esc before you 
release the mouse. 


Interactive Drop Shadow tool 
The Interactive Drop Shadow tool is 
quick to use, but remember to drag from 
the centre for a normal drop shadow, 
since dragging from the edges will 
produce a perspective effect. 


FreeHand tips 


From tiled backgrounds to scanning images, we've scoured FreeHand to come up with ideas 
that will not only save you time, but make you feel extremely clever as well... 


Text round ellipses 

To create text on the top and bottom of 
an ellipse, type in the text you want and 
place a carriage Return where you want 
the text to split. Select the text and the 
ellipse and choose Text, Attach to Path. 


Editing text on a path 

Often text running around a path is 
difficult to edit. If you select the path or 
text block and choose Text, Editor all the 
text is displayed in a dialog box making 
it much easier to change. Click Apply or 
OK once you have made your changes. 


Rotate a single object 

If you want to rotate a single object 
within a group, select the object while 
holding down the Alt/Option key. Then 
double-click on the object and the 
transformation handles will appear. 
Then you can scale, rotate, skew or 
move the object according to the cursor 
that is displayed. 


Emboss effects 

There are five different Emboss effects. 
Display the Xtras toolbar by selecting 
Window and Toolbars. You can select 


the Emboss effect you want at the top 
and adjust the settings. FreeHand 
creates the embossed effect by adding 
several objects, like a blend. 


Duplicating steps 

You can create the steps for an 
animation in FreeHand by selecting an 
object and choosing Edit, Duplicate. 
Rotate, scale or skew the object by the 
amount you want for each step. Don't 
deselect the object and go to Edit, 
Duplicate again. The object is 
duplicated with the transformation you 


applied. Just continue to create as 
many steps as you want. 


Creating a Blend is easy — just select the two 
shapes and choose Xtras>Create>Blend. 
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ext above and 
below an ellipse 
= [= 


Attaching text to a path is simple and you can organise the text to run above and 
below an ellipse by adding a Return wherever you want the text to break. 


Scanning images 

When scanning an image you want 
FreeHand to trace around, choose a 
resolution of between 300 and 600dpi. 
A higher resolution will result in too 
many points being added to the path 
when the bitmap is traced. Be aware 
that FreeHand requires large amounts 
of RAM to trace an image. 


Trapping for objects 

You add trapping for objects by applying 
a stroke to an object. The stroke needs 
to be twice the width of the trap amount 
(check this with your printer) since only 
half the stroke sits inside the object. 
Make sure you check Overprint in the 
Stroke inspector and uncheck it in the 
Fill inspector. 


Adjusting columns 

When you have several columns of text 
and the last column is falling short (ie, 
with fewer lines than the other columns) 


check the Balance box in the Text 
Adjust Columns inspector. FreeHand 
will adjust the lines of text so there 
are an equal number of lines in 

each column. 


Attributes 

To select a series of objects that have 
the same attributes (the same Fill, 
Stroke or font for example), go to Edit, 
Find & Replace Graphics and click the 
Select tab. Then choose the attribute 
from the dropdown list and options that 
pop up. Select where you want to 
search — among objects you have 
selected, the page you are on, or within 
the document. 


‘Clipping’ paths 

You can use any path as a ‘clipping’ 
path. It operates to hide any content 
outside the edge of the path. To create 
one, select the content you want inside 
the path and cut it. Create the path or 
select one you have already created and 


Creating Gradient fills 


You can create a Graduated fill in your 
object by selecting it and choosing 
Gradient in the dropdown menu in the Fill 
inspector. In the options that are then 
displayed, you can change the colours by 
dragging a colour chip from the Color 
Mixer and dropping it onto a chip in the 
Gradient. To add other colours to the 
gradient, click one of the colour chips and 
drag it down the bar. Then change the 


colour of the new colour chip. 

You can choose between a Linear and 
Radial fill by clicking the appropriate 
button towards the top of the inspector. If 
you choose a Radial fill you can adjust 
where the centre of the Radial gradient 
sits in the object by dragging the knob 

in the preview. Hold down the Shift key 
and click anywhere in the preview to 
reset the centre. 


To choose whether to scale the tiled contents 
of a shape when you scale the object, check or 
uncheck the Fills box in the Transform panel. 


choose Edit, Paste Inside. You can still 
adjust the path by selecting it. 


Tiled backgrounds 


To simulate a tiled background ona 
Web page, select the tile you are 
planning to use and Cut or Copy it. 
Deselect it and create a rectangle to 
represent the background of your Web 
page. From the Fill inspector, choose 
Tiled and click Paste in. 


Light beams 


To create the effect of a light beam, 
create an triangle with the point 
positioned where the light source is. Fill 
it with yellow and choose Lighten as the 
Lens fill from the Lens inspector. The 
objects under the triangle will be 
lightened as though seen through a 

light beam. 


Changing symbols 

To change an original symbol and 
update the instances created from the 
symbol, display the Symbols panel. 
Drag the symbol into the document and 
choose Modify, Symbol and Release 
Instance. Change the object and then 
drag it onto its original name in the 
Symbols panel and choose Replace to 
overwrite the original symbol. 


Personalising settings 
To create your own settings for new 


Add new colours to your gradient and adjust a 
Radial gradient’s centre using Fill inspector. 


There are five different ways of applying an 
Emboss effect. Try them out and play with the 
options to produce different effects. 


documents you create, start by creating 
a new document and adjusting things 
like the units of measurement, or the 
page size. Then go to Save As and 
choose Template as the file type or file 
format. Name the file FreeHand 
Defaults (Mac) or Defaults.FT9 
(Windows) and save in the English 
folder inside the application folder. 


Moving by increments 

Moving objects by increments using 
the Arrow keys is handy. You can change 
the distance moved each time you click 
the Arrow key by going to Modify, 
Cursor Distance and typing in a new 
figure. The measurement unit is the 
same as that selected by default. Note 
you can specify a different distance for 
when you hold down Shift and click an 
arrow key. 


Switching layers 

Since you can move a selected object to 
another layer by clicking its name in the 
Layers panel you might find your 
objects keep switching layers without 
you intending them to. You can turn this 
feature off by going to Preferences, 
Panels and de-checking ‘Clicking a 
layer name moves selected object’. 


Dividing layers 

If you have created a series of objects 
on a single layer and you want to 
distribute each one to its own layer, first 
group them. Then go to the Xtras menu, 
choose Animate and select Release to 
Layers. You could then export the file as 
a .swf file that you could open in Flash. 


Symbol instances 

If you need to use an object or graphic 
several times in your document it is 
most efficient to turn it into a symbol 
and place instances of the original 
symbol in your document. Select the 
object and choose Modify, Symbol and 
Convert to symbol. 


Setting styles 

If there are a series of settings you want 
to use for other objects in your 
document, create a style from an object 


Preparing your FreeHand document for print 


FreeHand offers various options that can Output Options under the File menu you 
can check the Convert RGB to Process box 


in case you have used any RGB colours. 


help ensure that printing achieves the 
result you want. The first thing is to remove 


any colours you haven't used. Go to the Also under the File menu you can choose 


Xtras menu and choose Delete, Allunused — Report. FreeHand will create a report 


named colours. Then you may need to including all the information indicated by 


the dialog box that appears. Check each 


There are several different Pantone 
libraries included with FreeHand. You can 
access them from the Color panel by 
clicking the Options dropdown menu. 


convert any Pantone or Spot colours you 


have used to Process colours. Do this by category on the left and check or uncheck 


clicking on each one in the Color List Panel _ the boxes that appear on the right to 
The report that FreeHand produces contains 
information about all the colours you have 


used and how the separations will print. 


and selecting Make Process from the determine the information that is included 


Click the Blend button on the Xtra 


Options menu in the Panel. By going to Operations toolbar and choose Xtras, 


in the report. 


that already has the settings applied. 
Select the object and display the Styles 
panel. From the Options menu, select 
New and give it a name. Select other 
objects and click the style in the panel 
to apply it. 


Resizing tiled files 

When you resize an object, you can 
choose whether to resize the tiled fill 
within it or not. Select the object and 
display the Transform panel. If you 
uncheck the Fills checkbox in the panel 
and type in the amount you want to 
scale the object, the tiled fill will remain 
the same size. 


Beginners’ tips 
If you’re new to FreeHand, knowing a 


few shortcuts up front can make the 
learning curve easier... 


Remembering shortcuts 

If you are a keen user of keyboard 
shortcuts, but are having trouble 
remembering them, you can print outa 
list of them all by going to File, 


Customise and clicking the Shortcuts 
panel. Click the Print button and then 
click Print in the Keyboard Shortcuts 
dialog box. 


Quick transformation 

To quickly transform an object (scale or 
rotate it), double-click the path and the 
transformation handles appear. You can 
drag the handles to scale the object or 
click and drag outside when the 
double-headed curved arrow cursor 
appears to rotate it. Double-click 
outside the object to release the 
transformation handles. 


Pointy stars 

To create a star, double-click the 
Polygon tool and the Polygon Tool 
dialog box is displayed. Check the Star 
radio button and choose the number of 
points for your star. Then adjust the 
Acute/Obtuse slider to make the points 
more or less pointy. 


Back to the Pointer tool 
While using one of the drawing tools, 
you often need to switch back to the 


Pointer tool to select and adjust part of 
the path you have already drawn. A 
quick way of doing this is to hold down 
Command or Control. 


Selecting behind objects 


To select an object that is behind 
another object, select the Pointer tool 
and hold down Control and Option 
(Mac) or Control, Alt and right-click 
(PC). Each time you click you will select 
the objects according to the order they 
are placed on the page. 


Printing in parts 

If you only want to print part of your 
document, you can either select the 
objects you want to print and check the 
Selected Objects Only box in the Print 
dialog box. Or make the layers you want 
to print visible and the rest invisible. 
Under Imaging in the Print Setup dialog 
box, make sure the Include Invisible 
Layers box is unchecked. 


Creating blends 


To create a blend, create the objects you 
want to blend between and select them. 


Create and Blend. You can also select 
individual points on each object before 
blending them to create some 
interesting effects. 


Choosing colours 


Choose a Pantone colour in FreeHand 
by going to the Color List panel, 
selecting Options and choosing the 
Library you want. Double-click the 
colour you want to select and it will be 
added to the Color List panel. 


Spaced out 

Rather than adding Returns to space 
out paragraphs of text, use the option to 
add paragraph spacing in the Text 
Paragraph inspector. Select the 
paragraphs of text and display the Text 
Paragraph inspector. Add the amount of 
space you want between the paragraphs 
in the Above or Below fields. 


Linking text boxes 

To link a text block to another object so 
that the text flows into the object, first 
select the text block with overflowing 
text. Then drag the link box in the 
bottom right corner into the new object 
and the text should flow over. 


Flash tips 


Flash 4 and 5 are packed with features for keeping 


your file sizes low. We've compiled some of the best... 


Drawing 


Improved toolset 

Macromedia finally bowed to user 
demand and equipped Flash 5, 
released earlier this year, with an 
improved onboard drawing toolset and 
a fully featured Bézier pen set. Previous 
incarnations offered only Quadratic 
curves, which you can bend using the 


normal Selection tool. While they’re 
fresh and intuitive to use, they just don't 
offer the control and range of the Bezier 
standard. If you're still on Flash 4, you 
may find you need to do most of your 
drawing in FreeHand or Illustrator, and 
import it into Flash. 


Bézier tool 
If you're using Flash 5, you may want to 
import drawings anyway, simply 


because you’re better used to the 
illustration app. Flash 5's Bezier tools 
are stilla little different, although the 
results are just the same. Use the 
simple Bézier to plot your points as 
usual; then use the same tool to add 
points, turn them from curves to 
corners, delete points, and so on. 


Onboard Subselector 


The onboard Subselector (an outlined 


arrow), enables you to select and drag 
individual points, and draw around the 
curve handles. Hold down Alt and you 
can drag the handles independently to 
create a point. It seems different, but 
works as well as FreeHand or Illustrator. 


Quadratic curves 

Flash's home-grown Quadratic curves 
give quite a different result, and it’s well 
worth experimenting. There are no 
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visible points involved: just hold your 
main Selector tool near an edge or 
corner of an object. You can drag 
straight edges out into deep curves, and 
adjust curve angles and depths — 
anywhere on the edge is fine, no need to 
find a point. You can drag corners 
around in the same way, and a clear 
cursor mark shows whether your cursor 
is over a curve or corner. 


Complex maths 


Quadratic curves have a certain 
disadvantage however, particularly 
because no points show, so you're never 
quite sure where any given curve begins 
and ends, what the details of its shape 
are, and so on. Often in animation you'll 
find yourself moving curves around 
several times in every frame, but the 
underlying maths becomes more and 
more complex, and getting the result 
you want becomes tough. 


Reshape with Bézier tools 


Fortunately, Flash 5 can usually 
translate between Quadratics and 
Beziers. If you've been twisting a shape 
in complex quadratic curves with your 
selector and it gets in a mess, you can 
reshape it with the Bézier tools. 
Sometimes starting again is the only 
option — but not an ideal one if you're 
working on animation. 


Animation 


Vector curves 


Vectors are the ideal medium for rapid, 
file-size-effective animation, because 
the code simply describes curves, 
rather than setting a colour for each and 
every individual pixel. It’s also very 


simple to make curve shape, corner and 
position adjustments for every single 
frame. If you're animating a stick man, 
it’s easier to move line-drawn limbs 12 
times for every second than redraw 

the pixels. 


Tweening 

Flash offers two types of tweening, 
which means you set the style of a line 
or object and one frame, then change it 
for another frame later on, and Flash will 
calculate what should go between. The 
user's player plug-in does the 
calculations, too — so the download file 
size only contains info for the two 
frames and the type of tween. Use this 
as much as you can. 


Shape tweening 

For animating drawings, the most 
powerful type of tweening is Shape 
tweening. Motion tweening is the other 
type, which you can use to simply move 
the position of an object, as well as 
change its colour, rotation, scaling, 
transparency and so on (hit F8 to turn 
the object into a symbol first). Use 
Shape tweening only if you need to 
change the curves of an illustration, like 
morphing. It's a bit tricky to get great 
results initially, and sometimes the 
effect is truly diabolical — but with the 
right skills you can achieve almost 
limitless, professional animation. 


Tweening in Flash 4&5 


In Flash 5 you set Shape tweening by 
selecting the frame in your timeline and 
selecting Shape in the dropdown in 
your Frame palette. In Flash 4 you need 
to double-click the frame and set it in 
the Tween tab there. Use Easing to 
control how the speed of the tween. 


Nice pic, innit? Using a combination of Quadratic and Bézier drawing media, you can 
create some exciting effects, and animation becomes the easiest of tasks. 


Trace Bitmap not only creates a great pop-art 
style effect, but in translating your bitmap 
into vectors, offers the opportunity to animate. 


Test your tweens 

The trick with shape tweening is to set 
the tween to run across just a few 
frames, and to make just tiny 
adjustments at a time using your Bézier 
and Quadratic tools. Hit Play to test the 
tween works right, then make another 
adjustment, test it again, and so on. It’s a 
time-consuming process, but that’s the 
nature of animation — and the results 
are always worth it. 


Shape hint 

If you’re having trouble getting the 
tween to look right, or your shape 
change is complex, you can use Shape 
Hints, which pick out corresponding 
points between the starting and 
finishing shapes. Select the shape, and 
then choose Modify>Transform>Add 
Shape Hint. Then move the yellow hint 
marker to the right place at the start and 
end frames, and check the tween is OK. 
You can add more shape hints to get 
things perfect. 


Tracing 


Trace bitmap 

Another great way to work with vectors 
in Flash is to import a bitmap and trace 
it, using the Modify>Trace Bitmap 
command. Like tracing in FreeHand and 
Adobe Streamline, this reads the colour 
contours of the bitmap and converts 
them into curves with Colour fills. You 
can create some great posterised, Pop 
Art-style effects, and there are various 
techniques you can use to make them 
look individual. 


Colour Threshold 


Of course, doing this involves numerous 
settings controlling how Flash reads and 
translates the pixels into curves. In 
short, Color Threshold sets the colour 
difference determining a different 
vector shape, and Minimum Area is of 
course the minimum size of a new 
vector shape. Curve Fit and Corner 
Threshold control the accuracy of the 
resulting vector curves. 


Using the same graphic over and over? Turn it 
into a symbol and save file space: Flash only 
need to store the info once, this way. 


File sizes 

Tracing is often a great technique to use 
if you have a bitmap that you want to 
tween and animate, or if you want to 
keep the file size down. But take care — 
if you set the Colour Threshold and Area 
too low, or the accuracy too high, the 
resulting curves could be so complex 
that the maths takes up more bytes than 
the bitmap pixels. 


* * 4 
Optimising 
Straighten and Smooth 
As wellas offering vector tools, keeping 
your file sizes low is the very point of 
using Flash and it’s equipped with 
myriad features for achieving this. One 
of the chief reasons for over-size Flash 
files is curves that are too complex. Like 
FreeHand, Flash has Straighten and 
Smooth commands in the Modify 
menu. It also has an Optimise 
command, which reduces the number of 
curves ina shape, hardly affecting the 
look at all. 


Optimise 

Initially, use the Optimise command, set 
Smoothing to Max and tick the Multiple 
Passes box. This makes the smallest 
file, and you can often reduce a shape’s 
maths by 40 or so per cent. It doesn't 
take a rocket scientist to work out this 
means your drawing will download 
almost twice as quickly, thus making 
your user a happier person. If the results 
aren't right, you go back with the Undo. 


Combining commands 

Combine the Straighten and Smooth 
commands with the Optimise to iron out 
unnecessary kinks and curves. You may 
get an even better result, in looks and 
file size. 


Group shapes 

Avoid using gradients, since these take 
up more bytes and convert shapes that 
you want to use more than once into 
symbols (hit F8); Flash only needs to 
store this info once if you do this. FEES 


Computer Arts Web Special — 
COSB0010 

Our latest Web design special 
gazes into the stars and predicts 
the future of WAP, the technology 
that’s bringing mobile phones and 
Web design together. Some of 
Britain’s most successful Web 
design houses are profiled, and in 
addition to 71 Flash Tips, we’ve 
got tutorials on LiveMotion, 
Dreamweaver 3 and JavaScript. 
CD Trellix Web 2.5 and Web Media 
Publisher — Web design packages 
for PC, plus Freeway, a Web design 
package for Mac. Plus 100 Flash 
symbols from the Sparkle collection. 


Computer Arts Photoshop 
Special — COSB0011 

Recreating the cover image with 
our massive tutorial is only the 
start of this invaluable Photoshop 
resource. Discover new tricks 
with 101 tips, use Photoshop 
with the Web, check out the latest 
cutting-edge illustrations, and get 
the definitive low-down on plug- 
ins. Plus resources, guides 
shortcuts and Websites. 

CD A complete version of 
Intellihance 3.0, the excellent 
image-enhancement plug-in. Plus 
My Portfolio, a handy image 
cataloguing tool, and 10 demos. 
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Computer Arts Dreamweaver & 
UltraDev Special — COSB0012 
UltraDev isn't just a ‘pro’ version 
of Dreamweaver: find out where 
to use DW and how UltraDev can 
help when it comes to adding 
features such as e-commerce. 
Also discover how to create a top- 
end Website, why behaviours are 
an important feature of DW and 
how to optimise Web graphics 
with Fireworks. Plus resources, 
books and an extensions guide. 
CD 30-day trial versions of 
Dreamweaver 3, Fireworks 3 and 
UltraDev plus a heap of free 
extensions and resources. 


Computer Arts Flash & 
Shockwave Special — COSB0013 
We lead you through getting to 
grips with the new features of 
Flash 5. Other tutorials on Flash 
include basic interfacing 
techniques, how to use motion 
graphics, advanced server 
interaction and writing your own 
3D engine. We also familiarise 
you with the basics of Shockwave 
and introduce you to its scripting 
language Lingo. 

CD We've got demos of Flash 5, 
Director 8, FreeHand 9, Fireworks 
3, Illustrator 9 and After Effects. 
Plus 25 Director behaviours. 


of the world 


Computer Arts Discover 3D 
Special - COSB0014 

Learn the latest 3D techniques with 
our five in-depth tutorials. Find out 
how lighting can make your 
renderings look more realistic and 
professional and our cover 
illustrator, Bill Fleming, gives expert 
advice on how to master rendering. 
We've got 50 beginner's tips that 
will give you professional results, 
and we review the best software 
programs and graphics cards. 

CD Three complete 3D programs: 
Pixel 3D, Blender 2 and Strata 3D 
and all the files you'll need to do 
the tutorials. 


Issue 47 — Code CA047 

Escape CMYK plus Photoshop 6 
revealed and cloning skills. 

CD 30-day dual trial of LiveMotion. 


Issue 48 — Code CA048 

Master MoviePack, plus 
combustion and UltraDev reviews. 
CD 30-day trial of MoviePack. 


Issue 49 — Code CA049 
Character animation in 3D Studio 
MAX, plus Flash 5 review. 

CD /Ilustrator 9 demo. 


Issue 50 — Code CA050 

Special 50th issue, tutorials in 3D 
Skills, Photoshop and Flash. 

CD Complete version of Merlin VR. 


Issue 51 — Code CA051 

Star awards 2000 - the best 
creative software and hardware. 
CD Full version of Pixels 3D. 


+44 (0)1458 271 108 


www.computerarts.co.uk/backspecials 
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Essential Typography 


Font evolution seems to have taken a quantum leap in 
recent years and the trend shows no sign of abating... 


esigning fonts, once the 
( » preserve of a small esoteric 
, band of specialist designers, 

j is now a mainstream pursuit. 
While some designers in the days of hot 
metal could labour for years and end up 
with just a handful of faces to their 
credit, the way in which programs like 
Fontographer facilitate font generation 
has meant that almost every major 
advertising campaign or large (and not 
so large) corporation now has its own 
custom typeface. 

You may have thought that with over 
40,000 commercially available designs 
now available, that there would be 


something for every need, but the 
ingenuity and drive of the latest batch 
of young designers shows no signs 

of abating. 

Fashion trends in fonts now seem to 
take months instead of years. 

While the early grungy trend lent 
itself to bash-’em-out punk aesthetics, 
a recent return to more refined forms 
has meant that designers now choose 
quality over novelty - and when you're 
up against a deadline you don't need 
those annoying PostScript errors 
untested fonts throw up. 

To produce a font that actually works 
in a professional environment takes a 


bit more care - and here's the basics for 
doing just that. 


Basic font savvy 


The most immediate choice you make 
as a designer is between headline and 
text fonts. Headline fonts, as the name 
implies, are generally designed to be 
used at larger sizes, and may be of the 
more decorative and detailed variety. 
They are readable in short word groups 
and sentences, but you wouldn't want to 
read a book set in them. 

Text fonts, on the other hand, are 
designed for exactly that. Any stylistic 
quirks are kept to a minimum so as not 


to interrupt the smooth flow of the 
reader's eye. 

Of course, what reads smoothly is 
also what is familiar, and faces like 
Goudy were considered hard on the eye 
when they first appeared. Luddites 
aside, many new text fonts are 
appearing and no one wants everything 
to be set in 10 point Times New Roman. 
On the Web, the limited number of text 
fonts available and the low bitmap 
resolution are still problems. 

That's not to say that text fonts can't 
be used as headline fonts - many are. 
The spacing between letters, while fine 
at small sizes, is generally closed up 
when using a text face at large sizes. 

The second set of major divisions are 
stylistic ones - the general range today 
is divided into categories like sans serif 
(without those little feet), serif, 
decorative, script, blackletter, slab 
serif... Each distributor seems to have a 
slightly different terminology. 
Categories seem to be wilfully ignored 
- we have modernist Old English, hybrid 


serif scripts, distressed Fraktur... The 
choice of font style will obviously 
depend on the context and what needs 
to be evoked. Some of the worst 
design, especially on the Web, is due 
to the inappropriate use of typefaces. 
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Rian Hughes 


He doesn't just do fonts you know... 


Rian studied at the LCP in London before 
working for an advertising agency, i-D 
magazine and a series of record sleeve 
design companies. 

He left to become a freelance designer 
and illustrator, working primarily on ad 
campaigns, record sleeves, book jackets, 
graphic novels and television. 

Since setting up Device, he has worked 
extensively for the British and American 
comic industries as designer, typographer 
and illustrator. Moving away from comics, 
recent work includes title sequences for The 
Box, poster designs for Tokyo fashion 
company Jun Co.'s Yellow Boots chain and 
an award—winning brochure for MTV 
Europe's Music Awards. His advertising 


typography earned a Campaign Press 
Awards Silver in 1996 and a Merit 
Award from the New York Art Director’s 
Club in 2000. 

In addition to designing typefaces for 
FontShop’s FontFont range, fonts for clients 
such as Mac User, 2000AD, Newquay Steam 
and PC Format magazine are released via his 
own label, Device. He has an extensive 
collection of Thunderbirds memorabilia, a 
fridge full of vodka, and a stack of easy 
listening albums which he plays very quietly. 


Illustration: Rian Hughes. Telephone: 0207 221 9589 [e] rianhughes@aol.com 
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Text fonts, while appearing generally 
simpler, are actually much more 
demanding to design. Large expanses of 
text should have an even ‘colour’, that is 
to say your eye shouldn't be distracted 
by dark or light clumps. These are 
generally down to poor spacing and 
kerning, or insufficient optical 
correction (see tutorial). Unless you’re 
aiming to create the effect of unstudied 
amateurishness, take heed. 

The design of headline fonts is an 
altogether different beast. While all the 
general rules of good construction still 
apply, here you can let rip. Inline, 
outline, fonts passed through fax 
machines, fonts made of 3D paper, 
bitmapping for it’s own sake... if it works 
in the context of the piece to hand, it’s 
the font to use. Many designers will 
custom build headlines and logos in 
Illustrator or FreeHand, and only import 
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the letterforms into Fontographer if 
the need arises for more extensive 
use or on large commissions by 
outside parties. 


Birth of PostScript 


Old font technologies existed for 
hundreds, sometimes thousands of 
years uninterrupted. 
Gutenburg set in 
motion an approach 
that, with minor 
modifications and 
automations, was still 
the leading method for 
printing as recently as thirty years ago. 
Hot metal was cast into matrices 
(moulds) and held together in frames 
(chases), inked, and paper applied 
with pressure. 

Early photo-typesetting machines 
from venerable hot-metal companies 


Font Piracy 
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such as Monotype used a laser which 
shone through a negative film and 
exposed each letter on a sheet of 
photographic paper. These bulky 
machines were similar to the manual 
headline Phototypositor setters, where 
a strip of photographic paper would be 
exposed by hand, letter 
by letter, from a 2- 
inch wide negative 
strip run between 
spools. These 
Heath-Robinson 


chemicals and a sizeable 
darkroom in which to operate. 

The invention in the Sixties of dry 
transfer by Letraset ushered in a new 
era of playful pop designs. Cheap and 
plentiful, they needed no special 
equipment or training to use. Text was 
still being set by the bulky Monotype 


affairs needed smelly 


style machines, but headlines could 
now be customised with a new degree 
of freedom. Designers were slowly 
beginning to see the entire production 
come within their control. 

Computers, specifically the Mac and 
PostScript, gave us the ability to see 
and change fonts live on screen. This is 
a huge step forward from the guessing- 
games of the ‘mark-it-up and see what 
comes back from the typesetters’ 
method that old design lags will still tell 
you about. While freedom in the hands 
of everyone means some hideous 
messes, the degree of control designers 
now have over even the smallest details 
means that design is in creative boom. 

We've never had such a powerful set 
of tools available to us, and the old 
divisions of type and image, design and 
illustration are blurring — as they 
should. Gutenburg, you'd have loved it. 


You have probably seen some of the knock-off or ‘sampled’ fonts in circulation. While it’s tempting to use an existing font as a starting point, a 


recent, historic, court ruling provided copyright protection for digital fonts, In the past, there was confusion in the courts betweena typeface 


design and the alphabet per se, the distinction not always being clearly articulated. Copyrighting of a typeface was sometimes mistaken as an 


attempt to copyright the form of the alphabet itself. However, On January 12, 2000, the District Court of Cologne, Germany, has passed 


judgement which grants copyright protection to digitised typefaces, regardless whether the type design as such is protected. It was 


Berlin-based typefoundry, FS! FontShop International, which spearheaded this breakthrough by suing another company for taking 19 of FSI's 


proprietary fonts and distributing them illegally on a commercial CD-ROM, under different font names. 


The judgement sets a new precedent. Until now, fonts did not enjoy much legal protection, based on judgments by the Federal Court of Justice in 


1953 and 1970. This was especially true for so-called bread and butter type, commonly used in ordinary printed matter, which perversely are 


actually the most time consuming fonts to design well. Though the court's ruling did not stipulate that all fonts have artistic merit, it did suggest 


that the contentious typefaces had aesthetical value to which copyright protection can be granted. However, the court decided that this was not 


a decisive factor, since digital fonts are actually computer programmes which are protected by copyright law anyway. The court followed the 


opinion of expert witness Burkhard Marowski who had argued that software used for the graphic representation of a typeface is actually a 


personal creation. He pointed out that designers need expert knowledge about computers as well as typography and typesetting in order to 


create their typefaces. Without these skills, they could not possibly develop the artistic and technical parameters which ensure the optimum 


representation of the typeface in digital format. The defendant did not appeal, thus making the judgement legal and binding. 


Starting a new font 


It's possible to start drawing from scratch inside Fontographer using the Bézier tools and then 
adjusting by eye until it looks ‘optically pleasing’ — although there's a bit of an art to this... 
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1 | One of the best ways to familiarise yourself 
with the basic layout of the Fontographer 
window is to open an existing font. This is Regulator 
Medium, a sans serif from the Device range. A word 
of caution: don't copy a design from an existing 
font — it's illegal. By all means study other designs, 
but see the boxout on Font Piracy. 
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4 | Some designers prefer to use ///ustrator's or 
FreeHand's superior drawing abilities and 
import the font letter by letter to be kerned and 
spaced inside Fontographer. To import an image, 
choose File>Import>EPS. Fontographer hasn't been 
upgraded recently, so you may have to save down 
from FreeHand or /I/ustrator to an earlier version. 
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A complete professional font will have an 

international complement of characters — all 
those accented vowels (A, é, 9, ¢...) symbols (¥, t, 
®, f,’...) and other esoteric stuff that you think 
you'll never need, but believe me are indispensable 
to someone in Sweden. Of course, if your font is 
never going to be used by anyone except you, you 
can stick to just the English character set. 


However, it is entirely possible to draw from 

scratch inside Fontographer. Start by selecting 
Guides on the Layers menu and pulling out a cap 
(capital) height line and a lower-case x-height line 
from the baseline. 


won 


Expand the stroke of your character, 

(Element>Expand stroke). This is equivalent to 
stroking a line in a drawing program, but here it is 
converted into a rectangle and two concentric 
circles. Type 2 fonts do not support stroked lines. 
‘Cap’ has been set to Square, ‘Join’ to Mitre. 


a4 


od a A nM 


8 | Resize to fit the baseline and cap height. 
Remove extraneous points by selecting 

them and choosing Points>Merge. Align the 

two elements. 


Choose New Font from the File menu. Save it 

with a temporary name — you can rename your 
fonts later. Double-clicking on one of the individual 
slots brings up the drawing window for that 
character. Here we will draw the lower case ‘b', 
which in this case is a good start as it has several 
shapes that are common with the ‘p’, ‘q’ and ‘d’. 


6 | The Bézier tools, though somewhat basic, will 
be familiar to anyone who has used a vector 
drawing program. Switch to the Outline layer and 
draw a vertical line and a circle. The Outline layer is 
where your letter artwork will be: whatever you 
paste into the Template layer shows as greyed-out 
guide version in that window only. Objects pasted 
into the Guides layer appear in the background of 
ALL characters. 


comes one of the skilled parts - much of what 
makes a good font great is down to optical 
correction. The point at which the upright meets the 
circle and the circle meets the baseline all needs to 
be adjusted to look optically pleasing. There’s no 
formula for this — just tweaking and careful 
observation. Printing each character out at a variety 


of sizes helps. 
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Take a look at the ‘b' from Regulator Light. 
The curved sections need to extend about 
4 per cent above and below the baseline to have the 
same ‘weight' as the upright rectangular part, so 
they look like they're sitting on the same baseline. 
The junction where the circle meets the upright has 
been thinned down to avoid distracting black spots. 


In this instance, the ‘b' forms the basis of 
several other letters. Cut and paste, flip and 
rotate to get the ‘d’, ‘p’ and ‘q’. 


FT 
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Compare the Wireframe view in 10 with this 

Preview view. The points and guides have 
been temporarily hidden by uncrossing the Guides 
box in the floating palette and selecting Hide Points. 
What works is what looks correct, not what is 
mathematically correct. The smaller the point size 
you intend the font to be used, the greater the 
optical corrections need to be — body text needs 
more correction than headline text. 


o In any font there will be several of these key 
characters that define the basic range of 
shapes. It's always best to tackle these first. In this 
case the ‘n’ will dictate the ‘h’ and ‘u’ (and with 
horizontal compression the ‘m'), so begin by pasting 
the ‘b’ into the ‘n’ slot. Turn on Snap to Guides in 
the View menu and bring down the height of the 
ascender (the vertical bar that extends up, as 
opposed to a descender which extends down on the 
‘p' or ‘q', for example). 


G Select and duplicate (command D) part of the 
upright. Attach to the right-hand side of the 
letter, adjusting Points to Snap to the existing curve. 
Now, many a poor font (like those free ones you 
usually get on the cover CD or the Web) will leave it 
there. But it's time for more optical correction. Cut 
and paste a copy of the entire letter as it stands into 
the Template layer. 


You will find that wherever a curve (especially 

a section of a circle) meets a straight line, the 
transition will look bumpy, despite the fact that it's 
mathematically perfect. To smooth this out, the 
transition needs to be gradual, the curve slowly 
levelling out before becoming straight. To make this 
adjustment, paste a copy of the letter into the 
Template layer. 


Flip back and forth checking your adjustments, 
select all (Apple-A) then choose Remove 
Overlap from the Element menu. 


G Remove the points at the base of the bowl 
(curved part) of the letter and rejoin the inner 
left curve to the upright. It will automatically snap to 
point if you enable Snap to Point in the View menu 
and create a tangent point. Points in Fontographer 
come in three varieties: curve (indicated by a round 
dot), corner (a square dot) and tangent (triangular). 
Here we need a tangent point. Toggle between 
points by hitting command 8, 9 or 0. 


18 | Use the underlying guide to adjust the points, 
again flipping to Preview and back. Turn 
Guides or Template on and off temporarily by 
unchecking the box next to the name. 


—~Fyde Bodh; 


19 | Because it is open, the ‘n’ will have more white 
space under it than the ‘d’ had. To make them 
look optically the same width, the ‘n' (and similar 
characters like the ‘u’) have to be narrower. Here we 
need to begin comparing several characters at once. Compare this view to the previous one. 
Hit Command-K to open the Metrics window. This The right side has been brought over until 
is where you will kern and space the font, but at this the two look optically the same width. Some 


stage we just need to compare a few letters at a adjustment of the Bézier curves will be necessary 

time, so give the character an arbitrary left and right here to keep those smooth transitions. Work in the You now have many of the basic shapes for the 
margin (‘L’ and ‘R’). Text can be typed in at the top Outline window and check the update in the ‘u’, ‘r' ‘a’, ‘g', 't', and so on. Cut and paste to 
of the window. Metrics window. create these characters. 


Many of the specifics will depend on the 
23 ; a : ; 
design. This illustration focuses on a simple 


Pointed characters need to extend above and 


sans serif as many of the basic principles carry over 24 bcisupthetacal th fi 
Repeat the process with the capitals. to ornate, decorative or serif faces. Transitions of Pare ‘a iy dj Cine We! acct i ai a 
Capitals, being generally larger, willneed tobe curve to straight are here illustrated in a serif from o. Visually adjust the ‘A, “W' and. V’, to matchia 
slightly heavier to have the same visually correct Times Roman. Generally speaking, the fewer points character that sits precisely between baseline and 
black-areas-to-white-space ratio. you use, the smoother the curves will be. cap height — the capital E is a good example. 


You will find that spaces between uprights 
have to be larger than the spaces between 


Assuming you just need a basic character set, curves. This is for the same optical reason that 
| once the characters you need have been curves have to extend below the baseline. Here a 
| te st KH e| | O completed, the next stage is the letter spacing. This _ value of 35 em units for each side of the ‘o' looks 
rt epRRE NRL: jd Runn i meebo involves adding the correct margins either side of the same as a value of 60 units for the uprights. The 
each character to make the font look even in text right-hand side of the ‘n' and ‘h’, which consist of a 


setting (the technical term is Colour). This isdone by curved and a straight element, have an intermediate 
adjusting the L and R tabs in the Metrics window or _ value of 55. Test values in many different short word 


by entering numeric values in the table below each combinations that have curve-to-curve relationships 
letter. There will be a set of basic spacings that can (say “hooee"), straight to straight relationships (say 
be copied to similar characters. Start with a round “lillh") and combinations ("olohn") to ensure they 
25 | Continually try new characters out in character, say an ‘o', and character with an upright, work in all cases. Getting a good even set of spacing 
word combinations with existing ones say an ‘h’ or ‘n’. Add some other similar characters values here will save you time when it comes to 
to ensure continuity. for context. kerning. Don't skimp. 
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Polishing 


At this point you may feel that 
you've finished, but as you use the 
font you will find that inevitably 
there are adjustments to the 
spacing and kerning to be made 
and refinements to the characters 
themselves. Print out a large text 
file and sample files at various 
point sizes to ensure that the code 
is clean and there are no printing 
problems. Usually | run a font to 
high-resolution film or bromide 
several times from several 
machines before a font is ready 
for release. Remember - it’s easy 
to do a ‘down and dirty’ font 
quickly, but it'll take a bit longer to 
produce a professionally polished 
and tested font. 
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Copy these values to other similar characters 

manually in the Metrics window or in the 
Metrics Assistance window, where characteristics 
can be linked across several letters automatically. 
Some characters that are unique such as the ‘s’ or ‘r’ 
are done on an individual basis. 


Characters that are made of two elements, 
such as the accented characters, can be 
created by referencing the original. This way, when 


the original is updated, so is the copy. Use Copy 


Reference from the Edit menu instead of Copy. 


Kerning individually adjusts the spacing for 

specific letter pairs. Adjust visually by moving 
the central ‘K' tab or numerically in the table below. 
Again, use several other letters around the pair for 
context. The temptation with kerning is to overdo it, 
but squint and see how each pair looks in the middle 
of a sample word or two. Here the LT and the AT 
pairs have both been kerned. 


Leading: 

Undertiae position: [-133 

Underiine wiatn: [39 | 

Retain path coordinates when changing em square 
Automatically compute em square trom axcent + descent 

Netice: E 10 Hughes 2000. A Device font. All rights reserved. Device: 6 


Road, Landon W2 4BU, 620 7221 9500 Fax 6207221 9589 
wow devicetonts.cousk e-matt rlanhughes aol.com Al rights 
reserved. 


Neer ot crac awetinins [ET] 


Name your font in the Font Info window. Use 
the pop-out menu on the right to select a 
weight — this will mean that in a multi-weight family 
it will appear in the right place in the Font Menu of 
your drawing program. Use a hyphen between the 
name and the weight, for example: Helvetica-Bold, 

and no letter spaces. 


30 You will have found that some letter 

combinations won't look correct no matter 
how you adjust the sidebearings. A classic case here 
is the LT combination. Looks fine in the 
arrangement LIT, but it's just impossible to have a 
single spacing value that will work in all cases. This is 
where kerning comes in. 


SO MOREORRG:{ 


Again, like spacing, there will be combinations 

for which the value is identical. These can be 
automatically carried across in the Kerning 
Equivalence table. This is useful in that as you adjust 
one combination, related pairs are also adjusted 
automatically. Depending on the style, somewhere 
in the region of a couple of hundred to a thousand 
Or so pairs are needed in a professional font. 


For on-screen display, the font needs a bitmap 

font. This is automatically calculated from the 
outline font, but can be adjusted in the Bitmap 
window. If you intend to generate specific point 
sizes, each bitmap can be adjusted here. This 
function is largely redundant now as ATM and 
programs such as /I/ustrator that display anti-aliased 
type recalculate the shape of each character directly 
from the font's vector information. 


A useful check here is to run through a file that 

has every combination there is — laborious, but 
necessary for commercial work. Hit File top-right on 
the Metrics window to import a text file and use the 
arrows to scroll up or down a line. 


‘File Eat View Clement Points Metries Windows Wnts Help. 


jie rietta erm: —— 
“Comptes: 

format: [PostScript type l _¥ 
-Oitmap sizes to output: 

ia 


design CentralDesktep Folder: 


overwrite existing les Gira Mie wit the same name aiteady exists) 


‘Where to output the fonts: — 


Choose Generate Font from the File menu. 

Choose the platform (Mac, PC and so on) from 
the pop-up menu, a basic bitmap size (12 or 24pt is 
good, or several if you have customised the bitmaps 
individually) and a destination folder. You will get a 
printer and screen font (or just one file for Truetype) 
to install in the usual way. Refer to your machine's 
manual for details of this standard procedure. EEE 


every issue with 
dual-format CD-ROM 


® 


*NT4 or Win2000 Pro 


a 


Try out this stunning 3D package withrour EXCLUSIVE demo 


¥orelDRAW 10 tested, 
and Jim Henson's 
Creature Shop 
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From Illustration 
to Animation 


Let ///ustrator take the strain of the 
artwork and help you compose your 
animation. The following exercise shows 
how careful preparation before you begin 
can make life simple later on 


ltthough experimentation can 
f be fun, don't be too keen to rush 
into animation programs. All 
\ too often, animation sequences 
can become overly complicated and 
difficult to manage. 

Combine this with development of the 
artwork and suddenly what started out as 
a simple home page project quickly turns 
into a house of horrors. Taking the time to 
go through all the proper planning and 
preparation can help avoid a minefield of 
issues later on. 

This tutorial shows how a lot of your 
animation decisions can be defined and 
created within Adobe /llustrator before you 
even start to use an animation package. 

Illustrator is a very strong ally in 
preparing animations for Flash. Vector 
assets can be easily managed and edited, 


changed and refined. A wide range of 
colour palettes means that you can choose 
far subtler combinations. 

And the use of layers can support the 
storyboard process. With this structure 
defined and decisions made, the 
animation process is that bit simpler. 

All Flash needs to worry about keeping 
the pace and motion even, and adding 
the final details that can bring static 
images to life. Follow the steps in this 
tutorial and you'll discover all the wonders 
of stress-free animation, normal working 
hours and you might even get your 
weekends back, as well. 
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Part 1: Back to basics 


We'll start with a sketch as a rough guide to the rest of the illustration. The first 
step is to scan it in then you can start developing a digital version in ///ustrator 


Try sketching out your illustration first. This will 

enable you to quickly make any compositional 
decisions and act as a handy guide, Then scan the 
image into your computer. 


Set up anew //lustrator document in RGB 


to which the digital version will be developed. 


mode. Go to File>Place and find the scanned 
version of your sketch. This will act as the template 


WL_| 


oc If you are using ///ustrator 9, then set the 
Opacity of the image to 50 per cent. Go to 
Object>Lock. You can now work over the sketch 
without fear of it moving or getting in the way. 


Part 2: Creating the basic shapes 


I/lustrator's default settings are useful for constructing shapes quickly. 
These can then be rotated and enlarged until you're happy with the effect 


egieer hia 


= 

gi Using the image as a guide, select a bright red 
and start defining the basic shapes that make 

up the sign. Use the Rectangle and Rounded 

Rectangle tools. This is a very simple way to 

establish the object framework. 


ve) Select the Type tool and generate your key 
message for the sign. Although the final font 
will need to be much thicker, at this stage use only a 
normal text width. The font shown here is Univers. 


4 | Go to Object>Expand Appearance to create an 
outline of the shape. Go to Objects>Ungroup 
to detach the arrow shape from the line. Rotate the 
arrow 90 degrees counterclockwise and enlarge to 
the approximate size. Use the Rectangle tool to 
generate a thick stem for the arrow. 


Go to View>Outline. To create the curved 

edges of the arrow, select the Ellipse tool and 
overlap circles on the three points of the arrow. 
Select all the shapes and click the OutLine button in 
the Pathfinder window. Use the Direct Selection tool 
to delete the unnecessary shapes. 
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Complicated shapes can easily be created 
using /Ilustrator's range of default features. 
Use the Pen tool to define a short line. Go to 
Effect>Stylise>Add Arrowheads and select arrow 6 
of 27. This contains the basic shapes that will make 
up the sign arrow. 


Back in the Preview mode, use the Add Anchor 
Points tool to elaborate the stem of the arrow. 
Use the sketch as a guide for defining the shape. 


Part 3: Then there was light 


To create the key structure for the sign, we'll thicken up the outlines and 
delete any unnecessary ones — ///ustrator automatically adds the curves 


Vecta3D plug-in 


You will need the Vecta3D 
plug-in to fully complete this 
tutorial. A demo version can be 
downloaded from ftp://sunsite. 
cnlab-switch.ch/mirror/ 
winsite/win95/demo/ 
vecta3d.zip 


The neon letter consists of an inner shape (the = 
light) and surrounding wider letterform. Select Go to Object>Path>Outline Stroke. You have 
your main copy and apply a 10pt stroke. This thickens G now defined the outer letterform as a vector 
the letters to give them a ‘signage’ feel. Select both and created the ‘neon’ feel. This also defines the 
lines of text then go to Type>Create Outlines. animation stages that will be used later on. 


Some of the characters will have generated 

more than the required amount of outlines. 
Use the Direct Selection tool to delete any that 
you won't require. 


— 
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4 | Select and copy the arrow, then go to 
Edit>Paste In Front and apply 16pt stroke. Go 
to Object>Path>Outline Stroke. This defines the 


Smooth the ends of the arrow shapes by 
adding two anchor points beneath each point 
then delete the top anchor. ///ustrator will 

first inward shape. Use the Direct Selection tool to 5 | This process needs to be repeated four times to | automatically generate a curved finish. You have 


delete the outer line. generate all the inner shapes for the arrow. now completed the key structure for the sign. 


Part 4: Adding the third dimension 


At this stage we'll create a grey framework to make it more obvious 
which Pantone colour to select — then convert these to RGB 


3D Transform 


Wiel am iviiyYS 
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a Once you have installed KPT Vector Effects, The structure of the sign and animation is now 
select the main body shape of the sign. Go to complete. To tidy up, select the more detailed 
e To extrude the text properly, select the relevant _Filter>KPT Vector Effects>3D Transform. Use the X, _ vector shapes. Go to the Pathfinder window and 


line, go to Object> Compound Path>Make. Z and Y co-ordinates to correctly tilt the shape. Use click Unite. Go to Object>Path>Simplify, select 100 
This ensures the copy acts as one shape rather than Extrusion to give it depth as well. Repeat for all per cent Curve Precision, then click OK. Repeat this 
individual characters. Repeat this for all the text. elements of the sign. for all the letterforms. 


ILlustration Special | 59 | 
arts 


4 | With complex illustrations, applying colour can 
get quite messy. A black and white version can 
help define areas of contrast and importance. Use 
the Swatch palette to define six shades of grey 
including black and white 


G With the grey framework in place, applying the 
right tone and contrast of colour is easy. Go to 
Window>Swatch Libraries>PANTONE coated. 
Select the object then select the colour chip to make 
the change. Selected chips will automatically appear 
in the Swatch window. 


To convert to Flash, all Pantone colours need to 
be converted to RGB. A Pantone colour is 
defined by a small white triangle. Select the chip you 
want to convert and open the Colour window. Click 
the More arrow and select RGB. You will notice that 
the white triangle has now disappeared. 


Part 5: Prepare to animate 


Breaking the animation into sections adds to the complexity of the final effect. 
It's easier to alter colours now than to wait until you're in Flash 


It's now time to start a new document in 

preparation for exporting into Flash. Break the 
illustration down into the bits that animate and the 
bits that don't. Select the black background and 
paste it into the first layer of the new document. 
Name this layer in an obvious way. 


Follow the same process for all the other 
animation sections. The more layers you 
break the animation into, the more complex the 
final result will look. 
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Co Select the main text and the back shape they 
are sitting on. Paste these into a new layer. 
Remember ‘Paste in front’ will position it precisely 
over the ‘off’ state. In the new layer, use the Colour 
palette to define the highlights. This animation 
should look a lot lighter than the first stage. 


ec Select the entire sign and paste it into a 
separate layer in the new document. This will 
represent the sign in the ‘off’ stage. Use your newly 
selected Colour palette to emphasise that the lights 
aren't on by darkening the key areas. 


reserve Faths (Oscard transparency) 
& Preserve Appearence (atten transparency} 


Quickly test the contrast of the animation by 
toggling visibility in the Layers window. Make 
any adjustments in the colour you think necessary to 
give the biggest impact. It's easier to change the 
colours now in ///ustrator than later on in Flash. 


G The document is now ready for importing 
into Flash. Go to File>Save as. Under the File 
Format dropdown, select Illustrator EPS. In the 
Format Options window select Version 7.0 
compatibility. Click OK. 


Part 5: Prepare to animate continued... 


Web palette 


Although it's good Web practice, 


there is less need today to adhere 


to the 216-colour Web palette. As 


the lowest common denominator, 


We have specified a Pentium II 


system, running thousands of 


colours on an 800 x 600 monitor. 


You can open the Illustrator EPS file directly 

into Flash. You'll notice that all the layers and 
names have been remembered. Go to Modify> 
Movie. Define the dimensions as 600x360px, set 
the frame rate to 15fps and select the background 
colour to black. 


You may notice that the sign is too big for the 
movie. Select all the sign elements then go to 


cent, then click OK. With the sign still selected, 
move into the desired position. 


Modify>Transform>Scale and Rotate. Type in 80 per 


10 Select all the elements in the main sign layer. 
Go to Insert>Convert to Symbol and name the 
symbol ‘the sign’. Duplicate the keyframe at Frame 
15 and reduce this second sign by 60 per cent, then 
move into the desired location and create a tween 
between the two. 


ri] ‘paul_on’ will be the first section to animate. 
To mimic the flashing neon, duplicate the 
keyframe twice leaving a frame gap between them. 
Place blank keyframes into these spaces. 


| 
| 
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To start building the animation, move the 

‘active’ layers 50 frames along. This clears the 
start of the work area making it easier to start 
developing the animation. 


The remaining animations will follow this 

process of ‘flickering’ before they turn on. 
Animate each section along the timeline, following 
the order of the layers. 


Part 6: Final details 


Finish the loop with a Frame Action keyframe, then use 
the floating controller to make any final adjustments 


Taal [Sound | Actions [Tweeniag | 


Goto ond ey (an) 


ay To create a lightning flash, open a new layer 
above the background. Use the Rectangle tool 
to create a large square that fills the screen. Fill this 
with white. Go to Insert>Convert to Symbol. 
Double-click on the new symbol and select 80 per 
cent ALPHA in the Colour Effects tab. Animate this 
in the same way as the neon sign. 


2] Add a final layer and label it Frame Action. 
Allow enough breathing space at the end of 
the animation, then add a keyframe in this layer 
looping back to the beginning of the last animated 
event or, in this case, the flashing neon arrows. 


rer] 
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Go to Control>Test Movie. You can now view 

all your handy work. Use the floating controller 
to help analyse the animation and make any 
necessary adjustments. When you're happy with the 
pace and impact of the piece, save as a SWF file 
ready for the Web. And that's it done. GEES 
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by Cooper Edens and Daniel Lane 
illustrated by Edward Miller 
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Book designer Ed Miller, found his career took off once he moved 
into digital illustration. “Learn to animate your work,” he says 


iven the increasingly complex work being | 
produced with 3D Studio MAX, Maya and 
Softimage to name a few, we're used to 
illustrators hitting us between the eyes with 
futuristic, impossible sci-fi images. 

Which is why the resolutely 2D work of New York 
artist, Ed Miller, stops you in your tracks: it’s so bright, 
quaint even, yet eminently commercial for just those 
reasons. In a technological age, his pictures represent a 
simple, bygone era - think Rocky and Bullwinkle, Top 
Cat, The Jetsons, slapstick and silliness. It’s pure retro 
- New York with the guns and drugs filtered out. 

As you'd guess from the simplicity of his images, the 
computer is a means to an end rather than an | 
experimental tool, but essential to his success | 
nonetheless. “It actually got my career really going,” he 
says. “Before the computer, | was doing my illustrations 


Illustration Special 


in cut-paper. | was struggling with the medium and not 
getting much work. But once | developed a portfolio of 
digital illustration, | started to get steady work.” 

At the time, Ed was working as an associate art 
director at Alfred A Knopf Publishers in NY, which he'd 
joined in 1990 as a senior designer. It went digital in 
1993, and, as a result, Ed learnt QuarkXPress, 
Illustrator and Photoshop, topped up with night classes 
in Flash. Now all his images are done ona Mac, in 
Adobe /llustrator, with Website work in Flash. 

In fact, he’d recommend the digital learning curve to 
any illustrator: “You should also learn to animate your 
work,” he says. “It could open up a whole range of work, 
especially now with the demand for illustration online. 
Also, | found it takes time to develop your own style, so 
allow yourself time to experiment.” In 1996, his digital 
work was so successful that Ed left Alfred A Knopf to 


run his own studio freelance, his quirky, colourful style 
lending itself brilliantly to a variety of illustration 
projects from childrens’ books and fashion, to 
informational maps and diagrams and greetings cards. 
Not surprisingly, given the energy of the place, New 
York’s own atmosphere permeates his work. “I’ve been 
intrigued by the city since | was a kid,” he says. “Its 
architecture, museums, and history are a real 
inspiration to me.” 

This explains why his work seems so familiar, and 
anyone who was glued to the TV during their misspent 
youth will find it particularly appealing. “I’m very much 
influenced by design from the 50s and early 60s,” he 
adds, “including architecture, textiles, animation such 
as The Jetsons, Rocky & Bullwinkle, Dudley Dooright, 
and TV commercials. | admire the work of graphic 
designers Saul Bass and Paul Rand and the album 
cover illustration work of Jim Fiore. | also like the flat 
cartoon style of today’s Batman, Dextor’s Laboratory 
and Spy Groove.” 

All these influences go to make up the distinctive 
Miller look - one that has been snapped up by 
HarperCollins, Loehmann’s Department Store, Muse 
magazine and the Bronx Zoo among others. It’s an 
impressive client list, and one which Ed plans to 
expand very soon to include interactive Websites. FEES 


1. This was the first of Ed’s fiction books to be done 
on the computer. “! wanted to tackle animals. Up 
to that point | hadn't drawn many, but this book is 
filled with them.” 


2. Published in 1998, this childrens’ book features 
skyscrapers of all descriptions. “Architecture 
interests me very much, that’s one reason | love 
being in NY. | also like doing maps, so the endpapers 
show a map of the world with the locations of famous 
skyscrapers.” Most of the research material was 
provided by the author, but Ed - previously an Internet 
virgin — used the Net for research. 

“| had to track down some reference on a building 
not yet under construction called Sky City 1000, due 
to be built in Tokyo, Japan. The architects in Tokyo 
sent me some drawings. It was very exciting to 
contact someone half a world away and get the 
information | needed right away. It was my first true 
experience on the Internet.” 


3. “Working on this book was a lot of fun,” says Ed, 
“because | could be completely inventive with the 
aliens. | combined photos within the illustrations — for 
instance, in one scene the characters are watching 
the Moon Landing on TV and | scanned in an actual 
photo of the Moon Landing.” 


4. Due to be published in spring 2001 by 
HarperCollins Publishers, NY, this juicy little book 
explains basic body biology to children. Bet you 
didn’t know your salivary glands looked like bits of 
cotton wool... All the concepts are fairly basic so Ed 
doesn't have to know a huge amount about the subject 
to illustrate it. “The author and editor supply me with 
most of the reference material. If | need to find 
something | look on the Web. These science books are 
a lot of fun for me - I'm learning a lot of interesting 
facts,” he adds. 


5. Some of Ed’s books could easily be adapted into 
Websites — this one, due out in Spring 2001, features 
diagrams within diagrams. “One scene needed to 
convey solar heating,” says Ed, “so | did the house in 
cross-section so you could see the heating 
mechanism in the walls, but the house is within an 
entire scene with the characters.” 
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by Franklyn M. Brantley 
illustrated by Edward Miller 


by Pau Showers 
iMhustrated by Edward Milker. 
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Illustrator to 
Photoshop 


Although thoroughly capable in 
their own right, Adobe ///ustrator 
and Photoshop can interact, 
combining their features and 
relative strengths to form an 
even more effective double act... 


ith /llustratorand Photoshop being developed 

and produced by the same company, it’s only 

natural to assume that they share a similar 

interface and a certain compatibility. And if 
that's what you’re expecting, then you won't be disappointed. 
In fact, at first glance you could be forgiven for thinking that 
the layouts were the same, which is part of Adobe's strategy: 
integrating the applications means that people who are more 
familiar with one or the other will find both easy to use. Both 
packages can happily stand on their own, but together they 
form a powerful alliance. 

They've borrowed each other's best ideas and features to 
improve and enhance themselves. For example /llustrator 
now has a very useful Layers palette, and while Photoshop 
doesn't have the ability to ‘multiple undo’ an image, it does 
have the History palette, which works in much the same way. 

Many of us work mainly with Photoshop, but still couldn't 
do without /llustrator because of the detail and definition it 
adds to an image. The idea behind the hands illustration was 
to show the compatibility between the two applications — 
one hand represents /llustrator while the other represents 
Photoshop. This tutorial is designed to show you how well 
they work together and how to make the most of them... 


(@)) 
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Part 1: The background grid 


The first step is the grid in the background. Throughout the tutorial the Fill Colour box in 
Illustrator should be switched off and the Stroke box left on, unless stated otherwise 


PC users note 


Throughout this tutorial, where a 


command is specified as ‘Apple’, 


PC users should instead use the 
Ctrl key. 


Copy and paste 


If you want to place something 
from /llustrator into Photoshop, 
you do not need to save it and 
then place it in. Simply select it, 
copy it and then switch to 
Photoshop before pasting in. 


On the level 


To help you keep things lined up 
and level, use the Pen tool to 
draw a line and convert it into a 
guide by pressing Apple +5 
This locks it into place, That way 
you won't have to worry about 
accidentally moving it. 
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g First open the Background Texture document in 
Photoshop. Next open //lustrator and place the 
same image in by going to Place which can be found 
in the File pull-down menu. Create a new layer 
above the placed image by selecting New Layer 
from the option list, found by clicking on the arrow 
in the Layer palette. Switch off the layer with the 
placed image on it. We will switch it back on later to 
check the position of the line drawings. 


q H 
4 | Go to Expand, which can be found in the 
Object pull-down menu. Make sure that the 
Object, Fill and Stroke boxes are checked then click 
OK. Next click on the Rotate tool and then hold 
down the Shift and Alt keys while rotating it to 
make sure that it stays at an exact 95 degrees. 
Select everything by pressing the Apple + A. Next 
we want to group everything, so press Apple + G 
to do this. 


Select the whole image and rotate it again. 

This time the image only needs to be rotated a 
small amount. At this stage, it is a good idea to 
temporarily switch the other layer back on to check 
that you have rotated it enough. 


To create the grid, use the Pen tool to draw a 

horizontal line. Select the Selection tool and 
then move it down about three or four inches while 
holding down the Shift and Alt keys. Holding down 
the Shift and Alt keys duplicates the line while also 
keeping it in line with the original. Keep the 
Selection tool selected, then double-click on the 
Blend tool. Type in a suitable number, depending 
on how far apart the two lines are, then click OK 
in the spacing block. 


= 


The grid now needs to be distorted. To do this 

select the Free Transform tool. Next click on 
one of the corners of the grid and distort the grid 
while holding down the Apple, Alt and Shift keys. 


8 | Change the Stroke colour to whatever you 
want — a lighter colour shows up more than a 
darker colour. The grids should be ‘stroked’ by 0.75 
of a point. 


Click on the end point of the top line and then 

on the same point of the bottom line - this 
creates a series of lines between the two. The 
number of lines created depends on the number 
typed in the dialog box for the Blend tool. If you are 
not happy with this, then Undo it and try again with 
a different number. 


Click on the Rotate tool then click in the middle 
of the smallest end of the grid about half an 
inch away from it. This changes the point that it 
orientates from. Start to move the grid, and then 
press the Alt and Shift keys. Rotate the grid until it is 
a mirrored version of itself. 


Save the grid because we will need to use it 

again at a later stage in the project. Press 
Apple + C to copy it, then go back to Photoshop 
and use Apple + V to paste it in. When prompted, 
select Paste Pixels then click OK. Position the grid 
and the press Return. 


Part 2: The foreground grid 


In this second stage we will use the image we have just created, changing it 
from a hollow grid into a grid of colour blocks... 


Using the rulers 


If you want to create an object of a 
certain size, then you can do this 
by using the rulers in the View 
pull-down menu. You can also 
bring up the rulers by pressing 
the Apple +R 


saved in part one. Select it all and then use the 
Divide tool which can be found in the Pathfinder 
palette. Ungroup it all by pressing the Apple, Shift 
and G keys then deselect the image by clicking 
outside of the selected area. 


Sen) po) it a fiom 

4 | Copy these remaining blocks by pressing 
Apple + C then paste them into Photoshop 

using Apple + V. Tick the Pixels box when asked, 

then click OK. Move the layer between the Grid and 

Background Texture layers before changing 

the Opacity to 80 per cent. 


Go back to ///ustrator, open the grid image and 

lock it in place by pressing Apple + 2. Select the 
Pen tool and make sure that you have chosen a 
distinctive stroke colour. Draw lines between the 
horizontal lines of the grid. Select all of the lines 
then paste them into Photoshop. Make sure that 
you set the Opacity to 50 per cent. 


Return to ///ustrator and open the grid that you 


Using the Selection tool, drag to select the 

desired blocks. Use Apple + X to remove 
them. Continue doing this until you are happy 
with what is left. 


«y Select the remaining blocks and pick a dark 
colour from the Colour palette to fill them. It 
is, of course, up to you which colour you go for 
although we've chosen a dark blue here. 


While still in Photoshop, create a new layer 

and then load the selection of the Grid layer. 
This can be done by holding down the Apple key 
and clicking on the Grid layer. Make sure that you 
are still on the new layer and go to the Select 
pull-down menu, then the Modify and Expand 
submenus. Type ‘2’ in the Expand dialog box then 
click OK. 


G Using the Airbrush tool, paint over small 
areas of the grid with white selected as the 
foreground colour. This gives the impression 
that the grid emits light. 
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8 | Create a new layer and load the selection from 
the layer that you have just pasted in. Expand 
the selection by following the last part of Step 5. 
Using a pinkish foreground colour and the Airbrush 
tool, paint selected areas. 


Make sure you have de-selected the layer then 

go to the Filter menu and select Gaussian Blur 
from the Blur submenu. Adjust the radius until the 
line is visibly blurred then click OK. 
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Part 3: The hands 


Now to add the shaking hands to the image. For this part you won't need to 
use ///ustrator, but don't quit out of it yet because we will need it again later 


Options 


By holding down the Ctrl key and 
clicking anywhere in the image 
you can bring up a handful of 
useful options. 
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g Hold down the Apple and Alt keys and then a Using the Pen tool again, select just one of the 
Open the Hand Shake image and, using the drag the selected area into the main image. hands. Change the Colour Balance accordingly. 
Pen tool, carefully select around the two hands. _ Use the Eraser tool to erase some of the arms but This can be done by going to the Image pull-down 
Load the selection by holding down the Apple key only erase a small part of them: you do not want menu and then selecting Colour Balance from the 
and clicking on the Work path in the Path palette. to have just hands. Adjust submenu. 


4 Deselect the hand and repeat the previous step 
on the other hand. When you change the 
Colour Balance make sure you pick a totally 
different colour. Deselect the hand then scale them G 
both by pressing Apple + T. Hold down the Shift 


Duplicate the layer by dragging the hand layer 
to the Create New Layer icon at the bottom of 


Use the Erase tool to erase a small area 
and Alt keys to keep the same proportions while the layers palette. Apply a Gaussian Blur to the new near the right-hand thumb on the new layer. 
you scale it. When you are happy with the size, layer. Set the Blend mode to Hard Light and change _ This gives the thumb slightly more definition against 
press Return. 


the Opacity to 76 per cent. the hand. 


9] Finally open the light rays document and paste 
it into the main image. Position it before 
duplicating the layer. Place both layers between the 
two hand layers, making sure that the duplicated 
layer is behind the original layer. Apply a Gaussian 
Blur to the duplicated layer then change the Opacity 


Link both of the hand layers together by 

clicking in the little box next to the eye. If you 
now decide to move the hand around the image, to 40 per cent. On the original layer the blend mode 
then both layers will move together. clicking OK. should be set to Luminosity. 


Go to Hue/Saturation which can be found 
in the Adjust submenu of the Image pull-down 
menu. Increase the Saturation slightly before 
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Part 4: Creating the circles around the hands 


In this part, we are returning to ///ustrator to create the 
orbital circles that go around the shaking hands 


Oddities 


This is not really a tip to improve 
your work but one to give you a 
smile every now and then. Hold 
down the Alt key while clicking 
on the little block next to the 
Zoom percentage in the bottom 
left-hand corner. This will not 
only bring up the usual options of 
current tools and number of 
Undos, but also a list of humorous 
options. These include such 
oddities as a pair of eyes that 
follow your every movement and 
the US national debt along with 
the phone number of someone 
called Doug, whoever he is. 


rt] Go back to ///ustrator and create a large circle 
by using the Ellipse tool. Make sure that the 
Fill box is switched off and that the Stroke box is 
switched on. 


o Go to the Rotate tool and hold down the Alt 
key while clicking in the centre of the circle to 
bring up the Rotate dialog box. Type in ten degrees 
and then click Copy. Hold down Apple + D until the 

lines fill the whole circle. 


Select the image and then copy it (Apple + C) 
and paste it (Apple + V) into Photoshop. 


Before pressing Return, adjust the perspective by 
holding down the Alt key while clicking on and 
moving the corner. 


Select the Scale tool and drag while holding 
down the Alt and Shift keys. You want to make 
the second circle smaller than the first one. 


Use the Pen tool and then, starting at the 

centre point of the circles, draw a line to just 
above the top circle. Hold down the Shift key while 
drawing the line to ensure that it remains straight. 


Go Select all of the image and then click on the 
Divide tool, which is in the Pathfinder palette. 
Hold down Apple + Shift + G to ungroup the 
selection. Click outside the selected area to 
deselect it. Next use the Selection tool to select the 
lines inside the smaller circle. Press Apple + X to 
remove them all. 


Duplicate the layer and then rotate and 

distort it to give the circle a different angle. 
Both the Rotate and the Distort commands can be 
found in the Image pull-down menu and then in the 
Transform submenu. 


re 


Go Using the Direct Selection tool, randomly 
click on different lines around the circle to 
erase certain lines, pressing Apple + X to remove 
them as you go. Next make the smaller circle by 
repeating Step 2. 


g While still on the Circle layer, load the selection 
of the hand by holding down the Apple key 
and clicking on the Hand layer. Use the Eraser Tool 
to erase the lines that should appear to be behind 
the hands. You will need to repeat this for the other 
circle layer. Duplicate both of the circle layers and 
apply a Gaussian Blur to both. 
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Part 5: Finishing touches 


In this final part of the tutorial we will add the finishing touches and 
final details needed to complete our image 


New brush 


To create a new brush, select the 
object that you want to use as a 
brush then click on the arrow in 
the top right-hand corner of the 
Brushes palette and go to New 
Brush. Select the type of brush 
that you want and then voila, a 


new brush. 


Return to ///ustrator and click on the Pen tool. 
Hold down the Shift key to keep the lines 


straight, and draw lines that rise and fall. Draw a #3 Before deselecting, go the Filter pull-down Using the Selection tool, select one of the lines 
series of these lines and then after selecting them all, menu and select Round Corners from the and change the stroke weight. This can be 
click on the Vertical Align Centre icon which can be Stylise submenu. Round the corners by two points done in the Stroke palette. Repeat this for the other 
found in the Align palette. and then click OK. Now deselect the lines. 


lines giving them all different weights. 


4 | Paste all of the lines into Photoshop. Change mie 
the perspective by going to the Edit pull-down Q Duplicate the layer, then press Apple + T to i 
menu and selecting Perspective from the Transform transform it. Move the point of orientation Ge 


submenu. After you have changed the perspective, cursor to the centre of the hands. Rotate the lines Go Starting with the very top layer, merge down 
rotate it so that it fits into one of the corners until they are in a suitable position. Repeat this all of the line layers by holding down Apple + E 
before pressing OK. step once more. 


until they are all on the same layer. 


8 | Use the Elliptical Marquee tool to select circles 
- - - on some of the lines. To make more than one 
Create a new layer and load the selection from selection hold down the Shift key. Then choose a 


the Line layer by holding down the Apple key bright foreground colour such as yellow to fill the 


while clicking on the Line layer. Go to Select > selection. After filling the selection, deselect it and 

Modify > Expand and then expand the selection by then apply a Gaussian Blur to the entire layer. Adjust 

2. Using the Airbrush tool, paint small areas of the the radius of the Gaussian Blur until it is impossible The final task is to just stand back and admire 
selection to give a highlighted look. to see the edges. Reduce the Opacity to 40 per cent. | 9 | your handy work. No pun intended. EES 
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Andrea Semple 


Ibiza proved a turning point for this young illustrator: “Spain was a 
great influence, lots of vivid, sunny, Seventies colour schemes.” 


f an idea doesn't take root on your native 
soil, then moving to another country can 
; cause odd things to happen. To risk straining 
i a fruity metaphor, the seed can flourish ina 
different climate... or at least that’s what 25-year-old 
Andrea Semple found after moving to Spain. 
Desperate for some sunshine after her Business 
Studies degree at Hull Uni, Andrea took off for Ibiza as 
an office manager. With an A-level in Art, earning a 
living as a designer was a possibility but, as she says: 
“| never really saw illustration as anything more than a 
hobby. Then | decided to send my pictures to various 
Spanish magazines and received three commissions in 
the space of a week.” 
This success may have been due in part to the way 
Andrea’s own lively style clicks with Spanish culture. 
“Spain was a great influence,” she says, “lots of vivid, 


sunny Seventies colour schemes.” There's no denying 
the ‘cute’ factor — think Japanese illustration — in her 
work. “I like using simple, solid forms and colours in 
two dimensions because it gives the pictures an 
innocent, upbeat feel. They’re quite girly and childlike, 
and | like that. | think the trend now is towards a simple 
and clean style of illustration which can provide a 
‘feel-good’ factor.” 

The Spanish climate may have given Andrea’s 
career the shot in the arm it needed, but after a 
two-year stay, including a stint in Barcelona, she 
recently headed back to Leeds where she lives with her 
boyfriend of six years. Not that it’s made a difference to 
the amount of commissions she receives. “| think with 
the Internet, it has become less important than ever 
where you are based. Most of the time | am working for 
London-based or international companies.” 


There’s no typical working day, although Andrea’s 
always at her desk by 8.30am and can work up to 14 
hours a day during busy periods. Needless to say, she 
loves the job. “It is great when your work and your 
hobby become the same thing. The best bit about it is 
that | have complete control over what | do. The hardest 
bit is balancing my time, especially when | have a lot of 
commissions on. | love working from home, although it 
is often difficult to put a full stop to the end of the day.” 

Self-taught and working on a graphite iMac, Andrea 
uses FreeHand, Illustrator, Quark and Adobe 
Photoshop, preferring the FreeHand and /llustrator 
packages to bitmaps because of the easy scaling and 
the small file sizes. “I think that too much emphasis can 
be placed on technology at the expense of the human 
element of design and illustration,” she says. 
“Technology is important, but only in terms of how it 
can add character to a picture.” 

If this sounds a bit all-art-and-no-trousers, then it’s 
worth bearing in mind that Andrea’s success owes a lot 
to her business-like approach. “I'd advise illustrators to 
learn how to market themselves,” she says. “A lot of 
good illustrators fail to get well-paid commissions, 
simply because they don't approach the right people in 
the right way. The trick is to have one eye on work in the 
present and one on work in the future.” EEE) 
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1. If ‘immediate’ and ‘accessible’ are key words for 
Andrea, then this cat illustrates the point perfectly. “My 
favourite. Simple and cute with a funky background.” 


2. This picture of a boy and girl clapping hands was 
recently sent to two children’s publishers in the UK. “I 
am now discussing the possibility of putting together a 
picture book for the under 5s.” Since moving back to the 
UK, Andrea has also started doing more for corporate 
clients on advertising campaigns. “I've only recently 
moved back to England,” she says, “so career-wise 
everything else is still pretty open”. 


3. This illustration appeared in the popular Spanish 
teenage magazine, Tu. “| worked to make a strong 
contrast between the boy and girl, but still show them as 
a couple.” 


4. The high-profile Spanish magazine Vanidades 
commissioned this graphic for an editorial piece about 
relationships. “The girl is waiting for the phone to ring. | 
think it’s got a typically Spanish kitsch feel.” 


5. This was commissioned for a Spanish restaurant 
chain based in Barcelona, where Andrea lived for a 
while. “The Spanish lifestyle is great, but it’s not the 
most work-friendly! I'm now based in Leeds, which may 
not have the Spanish climate, but it is still inspiring.” 


6. “This was my first commission after arriving back in 
the UK. It was for IPC Media’s Woman and Home 
magazine. | tried to make it as simple and vivid as 
possible with strong bold colours.” 
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Object manipulation 


The manipulation tools in Core/IDRAW 70 are designed 
to encourage you to explore alternatives to the 
traditional Bézier tool style of drawing 


he great thing about Corel’s interactive 
manipulation tools and photo-tracing is 
that they make it easy to produce 

! professional quality vector artwork, 
without demanding any photo-editing, 3D 
graphics or even Bézier drawing skills. 

The heart of the vector illustration package 
might be the Bezier Pen tool, but it’s certainly not 
essential for every job. Unlike most illustration 
packages, CorelDRAW 10 hides its Bézier tool ina 
flyout menu under the Freehand Drawing tool. So 
let's take Corel’s hint and avoid plotting points, 
nudging nodes and carving curves. For our tutorial, 
we'll focus on object manipulation instead. 

Going one step further, let’s embark on a project 
that actually requires pretty much no artistic effort 
whatsoever. We haven't done this to flatter the 
beginner, but to help you concentrate on 


CorelDRAW techniques rather than your own 
dexterity. This way you'll learn more about what the 
program can do to speed things up, and not waste 
time learning how to bodge through problems by 
tweaking your artwork manually at every stage - 
which is what most people do. 

Certain tasks in this project are achievable in 
previous versions of CorelDRAW. This latest 
release offers a simplified interface and additional 
interactive tools, among other new features, so 
we'll experiment with a few of these on the way. 
The tutorial also assumes you have conducted a 
‘typical install’ of the package which includes 
Corel Trace 10, so we'll kick off with this. 


Part 1: Vector tracing an image 


Using CorelTrace's dual-pane interface, we'll choose an image from the CorelDRAW 
disc, trace it, and then assess the vector objects individually... 


Preview quality 


Under the View menu, select 


Normal for your working preview 


mode rather than the default 
Enhanced. This way, everything 
you do will run much faster for 
very little sacrifice in visual 
quality, and you can toggle 
back to Enhanced from time 
totime as you like. Preview 
mode only affects the 
on-screen appearance, not the 
artwork itself. 


Run Core/Trace 10. Click on the File Open 

button and insert your CorelDRAW 10 Disc 3 
CD. Use the Open dialog to navigate into the CD, 
into the Photos folder and then the Misc folder 
inside it. Select the file '624079.wi' and select Crop 
from the dropdown menu as shown. 


4 | In the Options bar, change the settings so that 
you will be using the Low Noise filter, a 
Complexity value of 12, and 100 per cent Noise 
Reduction. Click on the Do Trace button at the end 
to generate a vector trace of the bitmap image. 


At this point you can bring the traced image 

into another file, but here we'll use it as the 
starting point for a completely new piece of 
artwork. From the Layout menu, select Page Setup 
and change the Page Size settings (including Bleed) 
as required. 


G Click Open, and you will be faced with a Crop 
Image dialog. Resize the crop area on the 
thumbnail image by dragging on the corner and side 
nodes. When you have cropped around the girl's 
head, click OK. 


G Click on the Save button and give your traced 

image a name. The default file type should be 
CMx: if it isn't, make sure you change the file type 
to CMX before clicking on Save. Try some different 
trace settings and save again to a new file. 


G Although we chose an obviously posterised 
tracing, let's soften those tones down a bit. 
Click once on the traced image with the Pick tool to 
select it. From the Arrange menu, choose Ungroup 
(or just type CTRL-U). 


| 3 | Ignore the ‘save is disabled’ warning and you 
will be presented with Core/Trace's dual-pane 
interface with the cropped photo image showing in 
the left-hand pane. By default, the simple Outline 

tool is selected. Click on the Advanced Outline tool 
instead (it has a ‘+' next to it). 


; 
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Go Exit Core/Trace once you've created and saved 
a few different tracings. Run CorelDRAW 10. 
Open the CX files and view them side-by-side 
using the Tile commands under the Window 

menu. Choose one that appeals to you the most 
and ditch the rest. 


9 | The vector objects which make up the girl's 
head can now be accessed individually, but 
they are all selected at the moment. Click 
somewhere else on the page away from the artwork 
to deselect everything. 
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EPS export 


When exporting CorelDRAW 
artwork to EPS format, click on 
the Advanced tab of the EPS 
Export options dialog which 
appears after giving it a filename. 
When you choose PostScript 
Level 2 or 3 from the 
Compatibility dropdown 
menu, you may see a warning 
message. If the EPS is going to 
be brought into a QuarkXPress 
or InDesign page, you can ignore 
the message. 


Pf Now click onto the big pinky-red background 
object around the girl's head and press the 


Delete key to remove it. Click on any additional 
remnant objects from the background and delete 
them as well, leaving just the girl. 
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4 | With the Eyedropper tool, click once 
somewhere on the girl's face. The colour is 
selected as the Active Fill and shown as a Swatch tab 
in the Status bar at the bottom right of the screen. 
Double-click on it to open the Uniform Fill dialog. 


This is a good time to save your artwork. 

Choose Save As... from the File menu, give the 
file a name, and make sure the file type is CDR, 
CorelDRAW's native format. From this point 
onwards, we'll assume you are saving regularly. 
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Click on the Add To Palette button to add the 

colour to the default colour list. Click OK, 
select another colour from the girl's face with the 
Eyedropper and repeat the process until you have 
stored several colours. CorelDRAW will prevent you 
from duplicating the same ones. 


From the Window menu, choose Dockers and 
then Properties. You can show or hide this 


Docker pane or even drag it away from the side as a 
floating palette. It provides a quick way of accessing 
Fill and Stroke styles, among other things. 


Now comes a tricky bit, so pay attention. 

| 6 | With the Pick tool, click on the light-coloured 
object making up the girl's forehead, then type 
CTRL-D to duplicate it. The new object will be 
selected automatically. 


Click on the original forehead object to select 


PTE NT 


Select the Interactive Blend tool, click on the 


Drag the new object back over the top of the 
original: it doesn't have to be a perfect match. 


Drag on a corner node with the Shift key held down 
to shrink the object in place. 


it. Use the Colour palette on the right edge of 
the screen or the palette in the Properties docker to 


change its colour to match the even larger object 
behind it. 


small light-coloured forehead object you've 
created and drag outwards to the larger object you 
have just recoloured. CorelDRAW generates a 
stepped blend of objects between them. 
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File sizes 


Try saving your artwork in 
different formats to get a feel for 


file sizes. Our tutorial file 
occupied 12.6MB as a PostScript 
Level 2 vector EPS, 22MB as a 
Corel interchange CMX file, and 
a whopping 375MB when 
exported to Adobe /llustrator 70 
format. Yet in its native 
CorelDRAW 10 format, it 
occupied a mere 144KB, 
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The result should be a smooth gradient-effect If the Blend technique creates too many 

transition. You can also blend between two jagged edges or strange twisty transitions, try When you are satisfied that your vector girl is 
existing differently-shaped objects, but be warned filling some of the objects with gradients. Use the at least a little smoother in appearance than 
that this does not always work out successfully. Use Interactive Fill tool to manipulate the direction and her original traced self, type CTRL-A to select 
Multiple Undo to its best effect and experiment a transition of these gradients using the on-screen everything and then CTRL-G to group it all together. 


little, creating more blended areas. slider as shown. Move her to one side. 
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Click and drag anywhere on your page to 


13 | Click and hold down your mouse button on the create the shape. Hold down the Shift key as 

Basic Shapes tool and choose the Arrow Shapes _ you do this if you want to keep its original From the Window menu, go to Dockers again 
tool from the flyout. In the Options bar across the horizontal-vertical aspect ratio. Left-click a Colour and choose Extrude. In the Extrude Camera 
top, click on the Perfect Shapes dropdown menu Palette swatch to fill the shape, and right-click on tab, give the effect a depth value of 5 and click on 
and select the four-way arrow shape at the end. the No-Fill swatch to remove its default stroke. 


Object Center to set the origin. Click on Apply. 


16) Click on the Extrude Rotation tab. If the Corel 


logo is greyed out, click on the Edit button 17 Click on the Extrude Light tab and add a 
below it. Then just click and drag the logo to adjust 17 couple of light sources by clicking on the 18 Select the girl and duplicate her with CTRL-D. 
the 3D spatial rotation of your extruded shape. Click —_ lightbulbs marked 1 and 2. Drag them around the Drag on a corner node to shrink her down in 
on the X button to reset if necessary, and Apply thumbnail and reduce their intensity. Click Apply to _ size. Click on her a second time to switch Edit mode 
when finished. finish. If it doesn't look right, click Edit to change so that you can rotate and skew the selection. 
things again. Finally place it on the arrow shape as shown. 
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Part 3: Creating a cube 


Transparent 
limitations 


CorelDRAW has provided 
Transparency Lens effects for 
years, but it is limited in many 
ways. To avoid disappointment, 
note that you cannot apply 
Transparency to Blended objects 
such as those generated in our 
tutorial. Nor can you apply it toa 
complex group: when it’s made 
up of 50 or more objects, a group 
cannot be made transparent. 
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2] It should be a simple matter for you to create a 
cube. Do this by drawing a square with the 
Rectangle tool and applying the same Extrusion 
settings to it, but using a different colour and a 
greater Extrusion depth. Make further shrunk 
duplicates of the girl artwork. 


convenience by selecting both and typing 
CTRL-G. Choose the Interactive Drop Shadow tool, 
click once on the arrow shape and drag downwards. 
Edit the drop shadow by dragging on the slider. 


4 | Bring the arrow shape artwork to the front by 
selecting it and typing Shift-PageUp. Duplicate 
the girl once again but this time resize her to almost 
fill the page trim. Send the selected giant duplicate 
to the back by typing Shift-PageDown. 


With the giant girl still selected, choose 

Transform from the Effects menu and then 
Invert from the submenu. This instantly changes all 
the colour fills to their negative values, turning the 
warm reddish hues to cool blues. 
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Switch to the Pick tool and click on the text. 

Use the Text Orientation menu in the Option 
bar across the top to change its appearance. Click 
on the path and right-click the No-Fill swatch in the 
Colour palette to make it invisible. 


Switch to the Text tool. Bring the cursor near to 

the curved path so that its icon changes, click 
and start typing on your keyboard. The text locks to 
the path. Change its font, size and colour. 
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3 Using the resize, rotation and skew handles just 
as before, manipulate the three girls so that 

they appear to be resting on the cube faces in 

perspective. It's easily done in a few seconds — much 

less difficult than most people expect. 


and (yes at last!) create a simple wavy curve in 
the conventional Bézier manner: click once and drag 
upwards, click to its right and drag downwards, click 
further to the right and drag back up. 
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9 | Use the Shape tool to adjust the path's Bézier 
handles and drag the red node at the 
beginning of the text to adjust its starting point on 
the path. Add a drop shadow, resize it and place it 
back onto your artwork. You're done. EEE) 
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Vector plug-ins 


Expand your creative repertoire with our 
guide to the most essential vector plug-ins 


hink of plug-ins and you think of 
Adobe Photoshop. It’s a fact that 
the majority of plug-ins available 
| today are raster-based. But the 
open architecture of Photoshop is also to 
some extent present within its vector 
cousin, /llustrator. Thankfully, developers 
and designers have taken note of this, 
producing plug-ins for /llustrator and its 
rival FreeHand that extend the toolsets and 
functionality of the apps in ways the original 
publishers have not yet addressed. 

Providing basic and advanced features 
that may once have needed another 


complicated piece of software, all the 
plug-ins you'll find over the next few 
pages will assist you in your vector 
workflow. Whether it be reasonably simple 
processes such as creating multiple page 
documents in /llustrator, or complex 
preflighting, there is sure to be a vector 
plug-in to suit your needs. Most of the 
plug-ins over the following pages are 
reasonably cheap and extremely 
accessible — all can be purchased and 
downloaded from the Web. So, sit back 
and relax as we guide you through the 
current pick of the crop... 


ILlustration Special 


pre UnRTRAense a 


i Company —_ | 
Virtual Mirror 


i [Telephone _ 


| | Website 


| 


www.virtualmirror.com 


[Company _ 


“Computers Unlimited 


ee . 


[ Te elephone pitas 
020 8358 5857 


Website 


www. ‘computersunlimited. co.uk 
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ector Studio is made up of six 
( Illustrator 8/9-compatible 
plug-ins, presented as 
palettes within the interface. 
First up is the excellent Envelope mesh 
that adds a whole range of time-saving, 
intuitive envelope controls. 

Creating Envelope meshes rather 
than standard envelopes, these meshes, 
once picked from the palette of presets 
(or the supplied loadable libraries), can 
be manipulated with /llustrator's Pen 
tool and then applied to objects or text. 
This makes for a superbly intuitive 
shape-editing tool. 

Second on the list is Morph brushes. 
Divided into seven brushes, Swirl, 
Sculpt, Exhale, Inhale, Scallop, 
Crystallize and Wrinkle, these original 
and wonderfully interactive brushes 
enable you to paint with and distort your 
vector shapes in real-time. Sometimes 
you could be fooled into thinking you're 
ina paint program. 


ust like its raster cousin, KPT 
Vector Effects 1.5 offers 13 
typically weird plug-ins to 
put a different slant on your 
vector artwork. Originally from the 
now-disbanded MetaCreations stable, 
KPT Vector Effects is unlike any other 
vector plug-in you will see. 

Unlike most vector utilities, you'll 
find it in the Filter menu — not as an 
integrated /llustrator palette. Opening 
each element presents you with an 
interface that couldn't be more different 
to the clean /llustrator offering. The 
screen goes black and up pops the odd 
yet strangely intriguing and intuitive 
MetaCreations interface. 

Anyhow, down to the nitty-gritty. One 
of the effects most likely to please is 
3D Transform. This does what it claims 
and converts 2D line work into simulated 
3D objects. You can do this by adjusting 
sliders to control the Extrusion, Bevel 
depth and Complexity of the object. You 


If you’ve ever experienced the 
frustration of selecting between and 
moving objects between layers in 
Illustrator, Selection Hat is for you. It’s a 
handy utility that moves entire selections 
to different layers, and generally helps 
manage and navigate your artwork. 

With a name like Gradient Factory, it 
isn't too hard to work out what the fourth 
plug-in does; it aids the creation of 
complex gradients within /llustrator 
with the minimum of fuss. 

The fifth plug-in is very similar, 
although to raster fans, it may prove a 
godsend. The Gradient Texture palette 
gives any /llustrator gradient the subtle 
textures and shading usually associated 
with bitmaps while maintaining the 
resolution-independent qualities of 
vector artwork. It’s easy to use and the 
results can be incredible. 

Last — and by far the most exciting — 
is GlassWorks. GlassWorks produces 
superb masks (or lenses) that can give 


certainly have to be careful though — 
add too much complexity and you could 
end up with a very large file! 

Other smaller effects within the 
package are ColourTweak — a utility for, 
yes you've guessed it, tweaking colours; 
Emboss; ShadowLand, for creating 
quirky drop shadows: and Sketch — a 
nice if rather dated-looking effect that 
adds a sketched appearance to the 
outline of an object (you can do this with 
the brushes introduced in /llustrator 8). 

A much more practical effect is 
Simplify, in which you can easily reduce 
the number of points on a path without 
affecting the object. This can help to 
reduce file sizes, reducing printing 
times and memory demands. 

A few more worthwhile effects 
round up the app. Flare, for example, 
creates otherwise nigh-on impossible 
flare effects; ShatterBox creates 
shattered objects; and VectorDistort — 
an effect that almost warrants a plug-in 


The Glassworks palette provides a way of 
creating wonderful Lens effects quickly. 


your artwork a wonderfully gritty and 
distressed look. This also works well 
with /llustrator’s new Opacity masks. 
Overall, Vector Studio from Virtual 
Mirror is easy to use, wonderfully 
creative, and only $129... essential. 


Verdict 


SIDI IC 


& 


The extremely cool 3D Transform effect 
convert 2D artwork to ‘fake 3D’ in minutes. 


on its own — enables the easy 
transformation of objects. 

Overall, KPT Vector Effects 1.5is a 
solid purchase. It may seem a little 
dated, but some of the effects are just 
impossible to produce any other way. 


Verdict 


SSID 
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May your words be 2D no more... 


| Price | 


$99 


| Company 


Vertigo 


Telephone | 


001 604 684 2113 


www.vertigo3d.com 


f 3D Words was simply a 
plug-in that extruded text, it 
really wouldn't be worth a 

[| mention — many other apps 
(such as KPT) have this ability built-in 
to their feature sets. But this /llustrator- 
only plug-in from Vertigo3D does much 
more. The normally laborious task of 
creating, setting up and applying 
extruded 3D text that runs along a path 
is transformed into a simple process. 


How it works 


All you have to do is simply type a 
string of text into the field at the top of 
the palette. Then select your favourite 
(or the most appropriate) font, give it a 
colour using a Vertigo or the Apple 
Colour Picker — not /llustrator’s for 
some bizarre reason, and then choose 
from the preset list to run the words 
along the offered complex paths in 2D 
and 3D space. 


boostX (2.5 


Interface- and productivity-enhancing tools for ///ustrator, courtesy of Barco 


Barco 


[Weite | 


http://dtp.barco.com 


ith many vector plug-ins 
offering a mixture of 
obscure and occasionally 
downright wacky effects, 
it’s a refreshing change when a utility 
that actually enhances /llustrator’s 
toolset comes along. One such plug-in 
that does just that is the boostX 
collection from Barco, which provides 
some extremely powerful tools. This 
Illustrator-for-Mac-only plug-in adds 
many productivity-enhancing features 
that can dramatically help with the 
design and print process. 


What's in there? 


The Area Select tool, which only selects 
objects completely covered by a 
dragged marquee (which can be angled) 
may not sound much, but it can be a 
great help when selecting awkward and 
small objects. The Dust Select tool is 
even handier; simply drag a marquee at 


It is a great shame that these paths 
cannot be altered or created manually 
because it detracts from the editability 
and functionality of the plug-in. If this is 
fixed in the next release, 3D Words 
could be the ultimate text-extrusion 
plug-in, but until then the preset paths 
are going to have to do. 

However, some editability does 
reside in the 3D Words palette. Text 
characters can be moved along a path 
and rotated, and you can customise the 
Extrusion depth, too. This can all be 
viewed in the enormous preview pane. 
But, one of the handiest features within | 
the plug-in is that you have the ability to 
pan around your created words in 3D | 
space, thus many combinations of 
paths/angles can be achieved. Once 
you're happy, simply click the Place 3D 
Text button and your words will appear 
on your /llustrator page. There is one 
more editability gripe though; once you | 
place the text, any further changes you | 


the size of the objects that you wish to 
select and voila, objects at that size are 
selected, even if you can't see them. 

Also included in the package is the 
Crosshair dialog. This enables you to 
create intersecting cross-hair guides 
that can be rotated. In other words, you 
can now align objects and artwork to 
diagonal guide lines — something 
Illustrator could have done with years 
ago. Another handy filter can split Fills 
and Strokes into separate objects. 

The Ink palette is a suitably 
important feature of boostx. It provides 
a handy and powerful pre-press colour 
editing and proofing tool, enabling you 
easily identify when Pantone colours 
are used, and convert them to custom 
spot or process colours. There are also 
tools that let you create custom palettes 
and utilities enabling you to split and 
mix spot colours. 

boostX may not be for everyone, but 
if you are a graphics professional 


Choose a font, extrude the text and place it on 
a path. It couldn't be simpler with 3D Words. 


make in the palette will not be updated. 
A further problem is that the shaded 
areas that are created are built from 
objects, rather than /llustrator gradients. 
Asimple yet reasonably effective way of 
creating 3D text in /llustrator. 


Verdict 


EDK 


Rather than offering design-orientated 
features, Barco's boostX is a set of tools 
aimed at improving your /llustrator workflow. 


looking for marginal improvements in 
functionality and productivity in your 
workflow, you could certainly do a lot 
worse. At $149, It’s also come down 
significantly in price. 


Verdict 


SI 
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Price 


$199 


Hot Door 


Telephone 


Buy online 


www.hotdoor.com 


hen it comes to technical 

drawing and tools for the 

engineer or packaging 

designer, /llustrator 
doesn't really have that much to offer. 
So, if you need effective technical 
drawings quickly and you’ve got 
yourself a copy of /llustrator 7, 8 or 9, 
what do you do? Shell out thousands on 
a CAD package, or get yourself a copy 
of the significantly cheaper, and easier 
to use, CADtools from Hot Door? 

Well, we think that you'll probably 
plump for purchasing the latter. 
Currently the only plug-in of its kind, 
CADtools does seem to offer exactly 
what it says on the tin - a feature set that 
transforms your copy of /llustrator into a 
full-blown CAD package. 


The features 


CADtools certainly gives you a good 
amount of features for your cash, 


3D PopArt {8 


Extrude 2D objects directly within ///ustrator 


$39 


Vertigo 


Telephone 


001 604 684 2113 


www.vertigo3d.com 


or astonishing of interfaces, 3D PopArt 
can be a great time-saver. 
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aybe not the most exciting of 
f plug-ins, 3D PopArtfrom 
Vertigo, offers a solution to 


the problem of extruding vector objects 
quickly. Nothing fancy, just does the job. 

The process of extruding artwork isn't 
difficult: bring up the small, but neatly 
dockable 3D PopArt palette, select the 
object you wish to extrude and apply. 

You'll be pleased to know that you 
get a few more options to tweak. Apart 
from the Extrusion depth, you can 
change the Horizontal and Vertical 
rotation values and light source. This is 
presented in a small preview pane, so 
you only get a rectangular representation 
of your image, but you can re-apply the 
effect until you’re happy with the result. 
Unfortunately, as with Vertigo’s other 
extrusion plug-in 3D Words, shaded 
areas are generated as multiple objects 
— making for complex and hefty files. 


Verdict 


Lusk 


immediately adding 38 new 
CAD-orientated tools to the already 
crammed /llustrator Tool palette. Each 
also handily contains red points 
indicating how many clicks are needed 
to work the tool correctly. Included 
within the toolset are facilities to create 
precise shapes, lines and arcs as well 
as dynamic dimension labelling. 

In addition, CADtools consists of four 
dockable palettes — CADattributes, 
CADtracker, CADdocument and 
CADtips. CADattributes helps you set 
the appearance of dimensions and 
labels before or after you create them, 
with an Update button adjusting 
dimensions that has been moved or 
resized. The CADtracker palette 
enables you to monitor and edit objects 
quickly and easily, while the 
CADdocument palette enables you to 
define such settings as scale, rulers and 
grids. CADtips provides useful tooltips 
and on-screen help. 


Proper technical drawing in /llustrator? 
CADtools offers just that for a fraction of 
the price of a ‘proper’ CAD package. 


CADtools is a specific plug-in designed 
to satisfy particular needs. If technical 
drawing within /llustrator is something 
that has been causing you problems, 
this easy-to-use plug-in may be just 
what you've been looking for. 


Verdict 


DEDEDE 


3D Invigorator & 


3D again, but this time for FreeHand 


Price 


$179 


Zaxwerks 


Telephone 


001 626 309 9102 


www.zaxwerks.com 


= ST TT 


The rather oddly titled 3D /nvigorator takes the 
logical approach to 3D and renders vectors to 
bitmaps — directly within FreeHand. 


here's one problem with 3D in 

VT illustration packages; because 

: of the limitations of vector 
graphics, it’s only possible to get ‘fake’ 
3D results. Zaxwerks has addressed 
this problem by making it possible to 
render artwork to bitmaps with the 
Mac-only 3D Invigorator for FreeHand 
or /llustrator. Within this large floating 
palette you can obtain, adjust, extrude 
and render vector artwork back in the 
host program as a bitmap. You can 
apply colours, alter light sources, create 
custom Extrusions and so on. You can 
even change the shading view from 
Shaded to Wireframe — just like a 3D 
app. There's also a long list of Edge 
presets and Reflection and 
Transparency controls. All you have to 
do is define the pixel size and 
resolution that you wish 3D Invigorator 
to render out to. Fantastic! 


Verdict 


SDI IDI 
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checkX-omni promises to prevent output disasters 


Price 


$649 


Barco 


Telephone 


Buy online 


http://dtp.barco.com 


Prevent nasty printing errors with checkX. 
It works extremely well, but at $649 that’s 
nothing less than it should do! 


ay f you’re preparing documents 

for a huge print run at an external 

‘f bureau, you'll want to check 
them before you send your documents. 

This is where checkX comes in. 
Especially designed for preflighting 
Illustrator documents, checkX is a 
series of plug-ins that enable you to 
evaluate the contents of any /llustrator 
document by comparing it to your own 
personal print settings. After checking, 
the plug-in locates every problem and 
enables you to edit accordingly. The 
plug-in also collects all the objects and 
items associated with a print job. 

As a preflighter for /llustrator, checkX 
is second-to-none. It should help avoid 
the print problems we all fear. Our one 
gripe is that it does seem rather dear. 
With other much cheaper preflighters 
out there, you may wonder whether 
you're getting your money's worth. 


Verdict 


EDK 


The guys at Sapphire Innovations have been busy of late. Not content with supplying 


hundreds of Photoshop and Painter plug-ins, the company has released a range of 


Illustrator plug-ins and utilities, including the spanking new Sapphire Pack 2. For the 


bargain price of £40 you get nine amazing plug-ins including Background, enabling you 
to rotate, scale and re-colour any path to create interesting backgrounds; Bloater, to 


create 3D undulating effects throughout selected paths; and Negative, a handy plug-in 


to take a negative of any path. Order at the Website [w] www.sapphire-innovations.com 


Layer Rotate is just one of many superb effects that Sapphire Innovations has to offer. 


MultiPage {5 


Multi-page ///ustrator documents thanks to Hot Door 


$49 


Hot Door 


Buy online 


www.hotdoor.com 


Creating multi-page documents is a breeze with 
Hot Door Multipage. This palette transforms 
Illustrator into a well-oiled DTP machine... 


sk anyone what they’d like in the 
iA next release of /llustrator and 
; we reckon the ability to create 
multipage documents would be at the 
top of the list. Well, for now we can stick 
to v9.0, thanks to the guys at Hot Door. 

The Multipage dockable palette may 
not Look like much, but it holds the key 
to this function. You can, for example, 
work with multiple master pages and 
set up margins and page numbers. 

Hot Door suggest ‘getting creative’ 
and turning pages into slideshows, but 
we think Multipage is strong enough in 
the fact that it can produce documents 
rather than pages within /llustrator 9. 
Another great feature enables you to 
export multiple page PDFs. 

For $49 you can buy Hot Door 
MultiPage and enjoy a freedom to 
create multiple pages that /Ilustrator 
just doesn't provide. Get this now. 


Verdict 


SEDI 


When creating complex, flowing artwork in /llustrator or FreeHand, a decent graphics 


tablet is nigh-on essential. Giving you the creativity of a pen and paper-type interface, it 


will enable you to express yourself like you never thought possible. 


At the moment, there's only one major player in the world of graphics tablets — Wacom. 


Currently purveying an amazing range of tablets, from A6 midgets to A3 giants, the 


» world’s leading provider of tablets 
| now has another trick up its sleeve 
q — the interactive pen display. This 
_ ingeniously enables you to sketch 
_ directly on a screen within your 
favourite application. Be warned 
_ though, the interactive pen 
display tablet (the PL-400) will 
set you back a whopping 
£2,230. But luckily you can 
pick up an A6 Wacom 
Graphire tablet, more than 
suitable for everyday use, for 
_ around £80. For more info on 


he entire Wacom range go 


~ to [Ww] www.wacom.co.uk 


The PL-400 is pretty revolutionary, 
but it certainly doesn’t come cheap. 
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SVG appeal 


Adobe is raving about this new format, but what exactly is it? 


sk any graphics professional 
what SWF stands for and 
you'll almost certainly get the 
swift reply: “Shockwave 
Flash’. The popularity of the format has 
risen to the point that virtually every 
graphics-oriented site has some sort of 
Flash content. To further prove the 
popularity, the Flash Playeris bundled 
with /nternet Explorerand Netscape. 
However, ask the same professionals 
what the definition of SVG is, and you 
may have them stumped. 

A format which has yet to catch on 
among professional Web designers, 
SVG (or Scalable Vector Graphics) 
should soon prove to be quite popular. 
Because it is an open-standard vector 
graphics language, it enables the user to 
create high-resolution graphics that can 
contain gradients, Filter effects and 
animation. All this can be created using 
plain text commands, because of the 
fact that SVG is based on Extensible 
Markup Language (XML). 

Developed by the World Wide Web 
Consortium ([w] www.w3c.org), the 
technology now has the full support of 
Adobe, not only backed up by the SVG 
features in recent versions of /llustrator 
and GoLive, but also the addition of a 


downloadable viewer supporting the 
two major browsers on Mac and PC. 

Adobe claims that complex layouts, 
sophisticated typography, and high-res 
artwork is now practical with SVG. One 
of the most exciting things is that the 
format is not limited to Web-safe 
colours and prints as the user sees on 
their monitor - a possible solution to 
something that continues to plague the 
online world. SVG will also print at full 
printer resolution. But, static imagery is 
not the only thing possible. Interactivity 
is here, most usefully in the form of 
JavaScript events, and the ability to 
zoom and pan without waiting for extra 
graphics to download. 

At this moment in time, Adobe offers 
some fine examples of how Scalable 
Vector Graphics can be utilised. One of 
these is online brochures. According to 
Adobe, users can create brochures that 
have the same glossy qualities as print 
brochures, but with interactivity and 
dynamism. Online Catalogues are 
another recommended possibility - 
further pushing the e-commerce 
approach of SVG. Since SVG supports 
precise colour on display and prints via 
sRGB (Super RGB) and ICC colour 
management. This is a big incentive for 


SVG and ///ustrator 9 


Welcome to the Adobe S¥O 
wetted 


Zone, Scalable 


Vector Graphics (30) isan exciting 


language for Web graphics from the Vora Wie Nob Conse than (VSO) 


This ares was created to give Web designers 2 tare of developing sites with SVB. Kt 


i to reat 
wd 


‘t's eamenitment t6 
‘section that guides you tw ough the basic repr te areating BVO content 


For links to the WBC and oar Web sites outside this preview wea, see the saxteenal. 
cats boat 


Getting storted 


© ee uma nd fot brertne te ovat tg eta 


achat ort 
© Start the tutorials by first reading the 


Toll worl about 801 Clink 
there te download 6V6 logos, 


earetully 


Notes about release 1.0 of the Adobe@ SVO Viewer (June 1, 2000) 


Find out all you ever need to know about Scalable Vector Graphics at Adobe's SVG zone at 


[w] www.adobe.com/svg 


companies and consumers (we suspect 
clothing companies in particular), as it 
enables the consumer to view onscreen, 
and purchase an item without the worry 
that it will be a completely different 
colour when it arrives. The full potential 
of this format has yet to be realised 


though, but with one of the world’s 
leading graphics software companies 
extremely committed to it, it could 
simply be a matter of time until 
everyone is talking about SVG. EE 


Exporting your ///ustrator artwork to Scalable Vector Graphics really is as easy as one, two, three... 


re] To begin with, simply open up, or create your artwork a Next, go to Window>Show SVG Interactivity. The 3 | Now hit Export, making sure that SVG is selected in the 


in Illustrator 9. Here we've created a simple logo (well, 
typed a few words really), making use of the application's 


new Styles palette. 
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SVG Interactivity palette appears. Now simply select 
the artwork, choose an event from the dropdown menu 
and type in some JavaScript, making sure you hit the icon 
at the bottom of the palette to apply it. 


file type field. Note the inclusion of SVGZ — this applies 
GZIP compression to the file. The file is now ready to be 
embedded in an HTML page. You should note that when 
exporting as SVG, ///ustrator Gradient meshes will be 


rasterized as JPEGs and bitmaps without an Alpha channel 
will be rasterized as PNG files. 


Real World Illustrator 9 


Everything you need to know in one complete package 


fee 


£29.99 


[4 Author 


Deke McClelland 


& Sandee Cohen 

[ Publisher at 
Peachpit Press 
0201704056 


he earlier chapters in this 
volume will be of particular 


ia! 
f i/ interest to new users of the 


ie software. Beginning with 
an overview of the /llustrator 
environment, they move on to offer a 
solid foundation on which to build your 
knowledge as you expand your 
repertoire and tackle more complex 
tasks further into the book. 

Split neatly into four sections — 
starting, creating, changing and 
colouring — you can easily locate just 
the chapter or section you need. After a 
thorough introduction to what's new in 
Illustrator 9, such as true transparency 
and Live Effects to name but two, the 
remaining chapters take a methodical 
approach to teaching. 

Written in a light and easy-to-read 
conversational style, each chapter 
illustrates the feature under discussion 
with plenty of well-chosen screenshots 


and sample images. You can tackle 
each chapter sequentially, or jump to 
the chapter you need, as and when you 
need to reference a particular subject. 
They are all self-contained, so you can 
learn a complete set of skills without 
having to refer constantly to other 
sections of the book. 

This is not a tutorial-based manual. 
You are taught each of /llustrator’s 
features in a logical progression, with 
clip-art used to illustrate how each 
feature operates. It’s up to you to put 
these skills to good use in your latest 
creations. No CD-ROM is included, but 
this isn't missed as you don't need any 
tutorial files as such, just patience and a 
willingness to learn new skills. As 
Richard Koman of Communication Arts 
states, “This is the ultimate /llustrator 
book. The definitive, everything-you- 
need-to-know tome about /llustrator.” 
Ideal for every level of user. 


Verdict 


LSUSESESLS 


FreeHand 9 Authorised 


QuickTime lessons augment this tutorial-based tome 


Tony Roame 


Publisher 


Macromedia Press 


[ISBN | 


0201700344 


o matter what your level of 
proficiency with FreeHand, 
this authorised manual 

ji from Macromedia will be 
your constant companion. No prior 
knowledge is assumed, making this an 
ideal choice for the absolute beginner. 
However, intermediate users will also 
find much to enable them to extend 
their skills and knowledge. 

The book is structured as a series of 
ten individual tutorials, each covering 
one of FreeHand 9's core features. 
Lessons begin with an overview and are 
based around short tasks. This allows 
the reader to assimilate the information 
in easily digestible units and put it into 
practice before moving on. 

An interesting feature of this 


package is its use of QuickTime movies. 


Sometimes a written explanation just 
isn't enough, so with this technique, the 
writers can actually show you how a 
feature works. And as the movies are 


fully integrated into the written manual, 
you have an excellent extra source of 
information should you need it. If you 
are involved with Flash animation on 
the Web, for instance, you will see how 
FreeHand’s drawing capabilities can be 
used to enhance your Flash animations. 
It’s clear from the first lesson that a 
great deal of thought has gone into the 
choice, layout and content of each 
individual tutorial, which have all been 
developed by Macromedia's own 
authorised trainers. Hints and tips 
which attempt to anticipate the 
questions that a new user would ask a 
trainer are scattered throughout. 
Overall, this manual represents a 
distillation of what Macromedia's 
trainers have learned over the past few 
years as they have trained each 
successive generation of FreeHand 
users. By the end of the course, you're 
sure to have a complete and solid 
grounding in FreeHand design. 
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Adobe Illustrator 9 
Classroom in a Book 


£33.99 


Adobe Press 


Publisher 


Adobe Press 


ISBN 


0201710153 


ldobe rey 


| lastrators, 


= 


ne of the best titles in the 
ri Classroom ina Book series, 
this complete course teaches 
you how this world-beating 
application works, and how you can use 
it to create truly astonishing images. 

15 tutorials cover all the essential 
features of /llustrator 9, beginning with 
an overview that enables you to grasp 
the environment you will be working 
within. You then move on through 
drawing basic shapes to preparing 
images for colour separation. 

If you’re looking for a manual that is, 
in effect, an in-depth version of the 
bundled documentation, you’ve come 
to the right place. The tone and design 
of this manual may not be to everyone's 
taste, but between its covers is all the 
information you need to become 
proficient with /llustrator 9. If no-frills 
information is what you're searching for, 
you need look no further. 


Verdict 


DIKE 


CorelDRAW 9 for Windows 
Visual Quickstart Guide 


Price 


£19199 


Author 


Phyllis Davis 


Peachpit Press 


ISBN 


0201354519 


f you've just installed 
CorelDRAW 9 but have no 
previous experience of the 

| program, this manual will be 
essential. You'll be able to learn the art 
of CorelDRAW from drawing basic 
primitives, through to printing your 
finished masterpiece from its clearly 
labelled step-by-step tutorials. 

The latest features of CorelDRAW 9 
are discussed, such as the new digital 
camera support and the long-awaited 
mini pre-print preview of illustrations. 
Most sections also have a project 
where you can practise your new skills. 

CorelDRAW can seem daunting to 
the beginner, but this will at least give 
you a grasp of how the package works. 
And when you need to brush up your 
technique, the manual happily serves 
as a reference. Colour illustrations are 
absent, but this is still one of the best 
beginner’s guides money can buy. 


‘Verdict 


SSIES 


Adobe LiveMotion 
Classroom in a Book 


£33.99 


Adobe Press 


Publisher 


Adobe Press 


020170322X 
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f you intend to design 
animation for the Web, then 
LiveMotion will be one of 

! your most trusted tools. The 
authors state in their introduction that 
LiveMotion is “the future of animation 
and interactivity for the Web”. This 
remains to be seen, but LiveMotion 
does offer the designer a raft of new 
possibilities, all of which are explored 
in this manual. 

Seamlessly integrating with other 
Abobe applications, you will see how 
you can import your layered Photoshop 
or Illustrator files into LiveMotion for 
further manipulation. The CD that 
accompanies is a must and includes all 
the files you'll need as you progress 
through each tutorial. 

The information you need to gain a 
thorough understanding of the 
application is here, but the design and 
language feel sparse and clinical. 


Verdict 


DIKE 


illustrator Masters 


Agosto (ed) 


Publisher 
ISBN 


1564965473 


sumptuous showcase of 
f some of the best /llustrator 
H artists working today. Each 

| artist's work is shown with an 
indication of which extra programs 
were used to create each image. 

From the abstract imagery of Shin 
Matsunaga to the cartoons of Dennas 
Davis, this group of 20 artists will not 
only show you what is possible with 
Illustrator, but inspire you to push your 
own creativity to its limits and beyond. 

Some chapters are complemented 
by assignment sections which 
demonstrate how some of the images 
were created, with step-by-step 
explanations. These aren't really 
detailed enough, but will at least give 
you an idea of which toolset was used 
in some completed pieces of art. 

Overall, a wonderful celebration of 
the art of /llustrator from the masters of 
the art. Buy this book and stare in awe. 


Verdict 


SII 


Mastering CorelDRAW 9 


Author 


Rick Altman 


| Publisher 


Sybex 


0782125204 


f you're after a comprehensive 
manual of CorelDRAW 9's 


; j ; features, look no further. 
ee 


i Written in a light-hearted 
style, your journey through the delights 
of CorelDRAW begins with a quick tour 
of all its main features, closely followed 
by the essential ‘what's new’ section. 
Perfect if you are upgrading. 

Of the eight sections that follow, the 
later chapters provide the most 
detailed information. The ubiquitous 
chapter on drawing for the Net is 
included, but it’s part seven that’s a real 
find — it gives detailed instructions on 
how to import images from other 
packages and how to handle the black 
art of printing from CorelDRAW. 

The final chapter is for those who 
want to push the package to its limits, 
explaining script handling and object 
management, making this a rounded 
package stuffed with detail. 


Verdict 


SHS 


Photoshop, Painter and 
Illustrator Side-by-Side 


| Price 


£36.99 


[Author _ aed 


Wendy Crumpler 


[ Publisher aa 


Sybex 


ISBN | 


078212626X 


llustrator doesn't exist in 
isolation. You'll always 
combine it with other 
| applications in your work. 
This manual shows you how the three 
apps of the title complement each other. 
Beginning with a look at the 
differences between the interfaces, the 
colour-coded sections offer detailed 
explanations of how key features such 
as layers, colour, masks and channels 
are handled by each package. 
Presented in full colour, each new 
section is prefaced with a detailed 
explanation of how each program 
handles the feature under discussion. 
Illustrator users will welcome this as 
they can instantly see how moving their 
artwork to the other applications will 
impact on the finished rendering. If you 
do own all three of these applications, 
this book will become as indispensable 
as your graphics tablet. 


Verdict 


SSC 


_ Sams Teach Yourself 
_ CorelDRAW 9 in 24 Hours 


£17 :99 


David Karlins 


f time is of the essence, have 
( a look at this manual which 

aims to teach you basic 

CorelDRAW design in 24 
hours. Structured as one-hour lessons, 
your confidence will grow as you move 
deeper into CorelDRAW interface. 
There are also some five chapters 
devoted to CorelPHOTO-PAINT. 

Each chapter explains what you'll be 
learning in the hour, and offers plenty 
of hints and tips that could only come 
from a veteran. Chapters conclude with 
a quick quiz to check how much you've 
learned and understood. 

Hours 1-3 cover basic drawing, with 
hours 11-14 being perhaps the most 
interesting, showing you how to apply 
effects to objects. 

Cleanly laid out with full but concise 
explanations of each technique, if 
you're ina hurry, this could be the 
manual you've been looking for. 


Verdict 


SH 


The CorelDraw Wow! Book 


£32.42 


Linnea Dayton, Shane 
Hunt and Sharon Steuer 


Publisher 


Peachpit Press 


ISBN 


0201886324 


s with the other titles in the 
series, this book is more than 
a manual. Inside is some of 

‘e the best rendering ever, and 
you get to see how it was created. 

Even if you have an early version, 
don't despair! Every version from 3.0 
onwards is covered — you’re even shown 
how to switch version 9’s interface 
back to version 8’s, if you prefer it. 

Each of the experts who has 
contributed to this book offers their 
knowledge unconditionally. You see 
some gorgeous artwork, supported by 
screenshots and step-by-step 
instructions. The reference for texture 
and fills is a unique resource that you 
will return to again and again. 

From basic drawing techniques to 
designing for the Web, this is a hybrid 
manual that looks good, but also serves 
as a visual teaching resource you won't 
want to be without. 


Verdict 


SIE 
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You saw it first in Computer Arts. Get noticed, get ahead... 


Send your work to us along with a full 
explanation of your techniques and 
software, the titles of each piece, and your 
telephone number on the disk itself 
(featured artists are often approached for 
work). Images should be sent as PC or Mac 
TIFF or JPEG files on CD-ROM or Zip disks, 
and a hard copy is a great help. We will 
endeavour to return all entries that provide 
an SAE. All contributions are submitted 

on the basis of a non-exclusive worldwide 
licence to publish, both in printed and 


electronic form. For information contact: 
ca.exposure@futurenet.co.uk but do not 
email low-res images. Instead, post hi-res 
files for print to: Exposure, Computer Arts, 
30 Monmouth Street, Bath, BA1 2BW. 


Note: Selection and production takes time, 


so please don't inundate us with enquiries. 


While every effort is made to ensure that your work 

is returned safely, all contributions submitted to 
Computer Arts are done so at the risk of the Owner. 
Future Publishing Limited cannot accept responsibility 
for them either in transit or while in Future's possession. 
Please remember to keep back-up copies, and if this is 
your only copy of the work, do NOT send it in! 


Shane Luskie 


[e] luskie@hypermart.net/luskie@yahoo.com 


@Johns, @Play and @Lunch 


“lam a firm Mac supporter and think 
that my Cube is the most sexiest piece 
of machinery on the planet,” says art 
school graduate Shane Luskie. With 
influences as eclectic as Robert 
Mapplethorpe, M C Escher, Van Gough 
and Edward Munch, is no surprise that 
Shane’s main inspiration is exploring 
organic forms. “I construct the human 
form using interlocking planes drawn in 
Illustrator, develop some sort of rhythm 
which creates form, and depth. | usually 
construct various elements like hands, 
feet, face, separately and then develop a 
composite image.” He tends to work 
straight on to the Mac: “In a previous 
job, | was criticised for not sketching out 
my ideas first on paper, but | prefer to 
use my screen like a canvas. | often 
imagine that I’m painting or drawing.” 
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©) James Green 


[t] 0113 2759614 
[e] jamesgreen@lineone.net 
[e] pudding.design@lineone.net 


Big Eyes, Pud Type, Chinese 
Face and Clumsy Music 
album cover 


Illustration Special 


James Green, aka Pudding, works 
mainly on record and CD sleeves, with 
magazine illustration on the side. “I’m 
really not interested in producing work 
that is obviously commercial,” he says. 
“I've had too many bad experiences of 
working for corporate clients, who are 
just interested in your ability to use a 
Mac. | think this kind of experience has 
really formed my attitude design-wise, 
as have the many designers who have 
influenced me. The late Tibor Kalman 
(Benetton Colours magazine) and 
Vaughan Oliver of V23 are two people | 
greatly admire. Their radical styles, and 
uncompromising uncommercial attitude 
impressed me most.” James also 
produces a lot of his own fonts — 
“cheaper, and quicker than wading 
through endless font foundries”. 


® James Marsden 


[t] 07866 397456 
City life magazine cover and 
Rusty 


James is no computer expert, “I’ve 
always drawn; | just happen to use a 
computer as one of my tools.” And that 
handily sums up his attitude to his work. 
“| own an archaic PowerMac that 
crashes whenever | try to run an email 
package so I’ve given up trying. The 
technical side of things doesn't really 
interest me. Being freelance is a bit of 
a gypsy lifestyle; | find myself working 
all over the place, on all kinds of 
computers running all kinds of different 
software. I’ve just had to learn to cope, 
but it suits me fine because I'd rather 
use my imagination than focus on the 
current technical environment.” And 
what fuels that imagination? “That's 
easy,” says James. “I’m inspired by the 
youthful energy and confrontational 
ethos of old punk and graffiti.” 


© Becky Halls 


[t] (The Organisation, London) 020 7833 8268 
[e] www.organisart.co.uk 


Would you...? and Play Cool 


“| started illustrating nearly three years 
ago, by chance initially than by intention, 
when my partner’s then agent, Jane 
Buxton, picked up on some of my early 
doodles. Encouraged by her response, | 
started to work commercially for some of 
the advertising and design houses in and 
around London. Fred, my partner, has 
been a commercial illustrator for 12 
years, so he’s a great person to learn 
from.” Working on a Mac, Becky combines 
hand-drawn and digital (Photoshop, 
FreeHand and Illustrator) elements to: 
“achieve a graphic and contemporary 
feel.” Because nearly all her work is 
delivered via Internet, she’s planning on 
spending the winter in the French Alps: 
“From where we will continue to work 
pretty much as we are at the moment, only 
in more scenic surroundings.” 


© John Woodcock 


[t] 01728 747909 
[w] www.creative-freelance.org.uk 


Lightning 


“Feathering and transparency were the 
best new features in /llustrator 9 as far 
as | was concerned,” says John 
Woodcock, who was joint winner of the 
Times Educational Supplements Senior 
Information book award earlier this year. 
“| like /llustrators accuracy and ease of 
amendment but | do try and escape 
from the overly hard-edged look that it 
can produce. I’m currently producing 
gardening AW for Reader’s Digest and 
am using feathering to soften and blur 
edges while still being fully editable.” 
One drawback to feathering is that it 
can drastically up file sizes, hence a 
recently purchased Bondi blue Imac. 
“Digital art can have a samey look about 
it, and | try and inject a slightly more 
painterly look to things without losing 
out on the benefits of vector artwork.” 
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©) Lasse Skarbovick 


[t] (The Organisation, London) 020 7833 8268 
[e] www.organisart.co.uk 


Poster and University 


Illustration Special 


An illustrator for 12 years, Lasse has 
recently completed six 2x6m murals for 
blocks of flats outside Gothenburg, 
Sweden (in /llustrator) and an illustration 
for the 2001 Adobe calendar. “I don’t now 
how to describe my style,” he says, “but it 
is very graphic, and often inspired by 
different patterns. It’s a kind of abstract 
decoration...” Influenced by David 
Hockney, Miro, Keith Herring, furniture 
design and architecture, Lasse aims for a 
certain simplicity of style: “I don’t think 
I'm aiming for any special effects, except 
maybe to minimise the use of colours 
and forms.” Working mainly with 
Illustrator 7, with Photoshop, Streamline 
and InDesign on a Mac, Lasse likes his 
job because: “I can work wherever | am, 
and when it suits me. | only need access 
to the Internet...” 


© Aaron Chambers 


[t] 020 8514 1820 

[e] aaron2@btinternet.com 
[w] www.blu-i.com 

[w] www.aaronius.cjb.com 


Hyperlink 


A self-employed designer specializing 
in Photoshop and 3D, Aaron's only 
recently added the vector graphics 
string to his already full bow. “I’m 
running Photoshop, Illustrator, Strata 
StudioPro, Quark, PageMaker, and 
Bryce on a G3, but I’m also looking at 
Cinema 4D for animation which will 
hopefully become a main part of my 
business. But | made this example in 
Illustrator 8. The idea was to show the 
link between sites on the Internet, and 
the routes that people take to their 
virtual destination.” Aaron cites 
architecture and art deco interiors as 
major influences on his work. Manga 
is also a style that he likes but is 

still working to attain. “As for other 
influential artists, there are many, but 
particularly Alec Syme.” 


Flightsimula 


Ingela Peterson 


[t] (The Organisation, London) 020 7833 8268 
[e] www.organisart.co.uk 


Christmas gifts and 
confused tourist 


Ingela is one of a group of eight 
illustrators working at Stockholm 
Illustration, where she’s been for a year. 

“| prefer sitting with a group of illustrators 
because it would be so boring to sit by 
myself. | need advice when | can't see 
clearly.” A former ad assistant, newspaper 
designer and art school grad, Ingela 
collaborates on childrens’ books with her 
husband, and works with ad agencies, 
publishing houses and magazines. “I 
would like to do a little more design in the 
future, package design for example. 
Packages really inspire me, especially 
from the 50s and the 60s. | also get 
inspired by textiles and wallpaper from 
that same era. Basquiat, Dubuffet and 
Picasso also inspire me a lot when | paint 
which | do sometimes to get a big change 
from the more graphic computer work.” 


Chris Davidson 


[t] (The Organisation, London) 020 7833 8268 
[e] www.organisart.co.uk 


Boss and Telecom 


A native New Zealander, Chris’ move to 
the UK and travels in Europe have 
inspired his artwork: “As an illustrator | 
feel its important to soak up your 
surroundings and take in all aspects of 
your environment, as you're likely to 
draw upon this knowledge at some point 
in the future.” Salvador Dali is a big 
influence: “I love the multiple meanings 
and depth to his artwork, stimulating 
one’s thoughts and challenging the 
viewer. | try to bring this to my work 
when I’m reading an article, I'll look to 
explore a variety of avenues and draw 
out elements from within the article, so 
that little subtleties and nuances 
become apparent in the illustration.” 
Chris usually designs in /llustrator: 
“Working in several layers which allows 
easy transfer to Photoshop layers.” 
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§ Next month 


Photoshop 


An in-depth look at the new interface and features in version 6 @ Get creative with our expert tutorials 


Reserve your copy today 


Ask your newsagent to 


reserve or deliver your 
copy of Computer Arts to 
your door every month. 


Tips to give you professional results ¢ A comprehensive guide to Photoshop plug-ins 


On sale Friday 29th December 


Constant updates at www.computerarts.co.uk 


computer 


The definitive guide to art, design and technology 
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